﻿body {
    font-size: 72.5%;
    font-family: "微軟正黑體", "Microsoft JhengHei", "新細明體","Trebuchet MS", "Arial", "Helvetica", "Verdana", "sans-serif";
    overflow:hidden;
}
.ui-widget,.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: "微軟正黑體", "Microsoft JhengHei", "新細明體","Trebuchet MS", "Arial", "Helvetica", "Verdana", "sans-serif";
}
html, body, #mapDiv, #layoutmain {
    padding: 0;
    margin: 0 auto;
    height: 100%;
}
#mapDiv, #menuR, #menuRB, #layouttop, .Copyright {
    -webkit-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}

#jqSlider {
    position: absolute;
    right: 25px;
    top: 25px;
    height: 200px;
    z-index: 500;
    font-size: 0.75em; /* 12 pixels */
    box-shadow: 3px 3px 5px #000;
}

    #jqSlider .ui-slider-range {
        background: #729fcf;
    }

    #jqSlider .ui-slider-handle {
        border-color: #729fcf;
    }

.w2ui-panel-toolbar {
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #dbdbdb 47%, #9b9b9b 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#dbdbdb), color-stop(100%,#9b9b9b));
    background: -webkit-linear-gradient(top, #ffffff 0%,#dbdbdb 47%,#9b9b9b 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#dbdbdb 47%,#9b9b9b 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#dbdbdb 47%,#9b9b9b 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#dbdbdb 47%,#9b9b9b 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#9b9b9b',GradientType=0 );
}

.w2ui-icon.pan {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/icons.png") !important;
    background-origin: padding-box !important;
    background-position: -416px 0;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.zoom-in {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/icons.png") !important;
    background-origin: padding-box !important;
    background-position: -688px 0;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.zoom-in-fixed {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/icons.png") !important;
    background-origin: padding-box !important;
    background-position: -672px 0;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.zoom-out-fixed {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/icons.png") !important;
    background-origin: padding-box !important;
    background-position: -704px 0;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.zoom-full {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/icons.png") !important;
    background-origin: padding-box !important;
    background-position: -656px 0;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.view-back {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/icons.png") !important;
    background-origin: padding-box !important;
    background-position: -592px 0;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.view-forward {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/icons.png") !important;
    background-origin: padding-box !important;
    background-position: -608px 0;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.measure {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/icons.png") !important;
    background-origin: padding-box !important;
    background-position: -304px 0;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.select-clear {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/icons.png") !important;
    background-origin: padding-box !important;
    background-position: -496px 0;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.identify {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/info.png") !important;
    background-origin: padding-box !important;
    background-repeat: no-repeat !important;
    background-size: auto auto !important;
}

.w2ui-icon.moveup {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/moveup.gif") !important;
    background-origin: padding-box !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
}

.w2ui-icon.movedown {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/movedown.gif") !important;
    background-origin: padding-box !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
}

.w2ui-icon.tools {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/tools_16.png") !important;
    background-origin: padding-box !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
}

.w2ui-icon.help {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/help_16.png") !important;
    background-origin: padding-box !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
}

.w2ui-icon.legend {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/legend_16.png") !important;
    background-origin: padding-box !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
}

.w2ui-icon.location {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/location_16.png") !important;
    background-origin: padding-box !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
}

.w2ui-icon.message {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/message_16.png") !important;
    background-origin: padding-box !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
}

.w2ui-icon.googleview {
    background-attachment: scroll !important;
    background-clip: border-box !important;
    background-color: rgba(0, 0, 0, 0) !important;
    background-image: url("images/gsv_16.png") !important;
    background-origin: padding-box !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
}

#abgne-block-20120427, #abgne-block-20120427 li {
    list-style: none;
    margin: 0;
    padding: 0;
}

#abgne-block-20120427 {
    position: relative;
    top: 0px;
    left: 0px;
    /*width: 428px; /* (圖片的寬度 +  _margin) * 數量 - _margin */
    /*height: 64px; /* 圖片的高度 */
}

    #abgne-block-20120427 li {
        position: absolute;
    }

        #abgne-block-20120427 li img {
            border: none;
            box-shadow: 3px 3px 5px #000;
        }

#menuRB img {
    border: medium solid #66F;
    cursor: pointer;
}

.basemapmenu, .basemapmenu li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.basemapmenu {
    position: relative;
    top: 0px;
    right: 0px;
    /*width: 328px; /* (圖片的寬度 +  _margin) * 數量 - _margin */
    height: 64px; /* 圖片的高度 */
}

    .basemapmenu li {
        position: absolute;
    }

        .basemapmenu li img {
            border: none;
            box-shadow: 3px 3px 5px #000;
        }

.ui-front {
    z-index: 500;
}


.mareaIcon {
    background-image: url("images/Measure_Area16.png");
    height: 16px;
    width: 16px;
}

.mdistanceIcon {
    background-image: url("images/Measure_Distance16.png");
    height: 16px;
    width: 16px;
}

.mrectangleIcon {
    background-image: url("images/Measure_rectangle16.png");
    height: 16px;
    width: 16px;
}

.mcircleIcon {
    background-image: url("images/Measure_circle16.png");
    height: 16px;
    width: 16px;
}

.pointIcon {
    background-image: url("images/point.png");
    height: 16px;
    width: 16px;
}

/*Adding the Resize Icon Back*/
.ui-dialog .ui-resizable-se {
    width: 14px;
    height: 14px;
    right: 3px;
    bottom: 3px;
    background-position: -80px -224px;
}

/*togglebutton click color*/
.claro .dijitToggleButtonChecked .dijitButtonNode {
    background-color: #ff6a00 !important;
}

.ui-dialog {
    opacity: 0.90;
    filter: alpha(opacity=90);
}

.ui-tabs .ui-tabs-panel {
    overflow: auto;
}

.ui-tabs .ui-tabs-panel {
    padding: 0px;
}

.styled-select {
    float: left;
    min-height: 34px;
    /*width:150px;*/
}

.SKindDIVBUSY {
    _position: fixed;
    position: absolute;
    z-index: 99;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    _height: expression(document.body.offsetHeight + "px");
    background: url(images/load_icon.gif);
    background-position: center;
    background-repeat: no-repeat;
    background-color: White;
    opacity: 0.6;
    filter: alpha(opacity=60);
    display: none;
}

table.listview {
    background-color: #FFF;
    border-collapse: collapse;
    width: 100%;
    text-align: center;
    padding: 1px;
    font-size: 12px;
    /*white-space: nowrap;*/
}

    table.listview th {
        background: #3e83c9;
        color: #ffffff;
        font-weight: bold;
        border: 1px solid #ffffff;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        padding-left: 0px;
    }

    table.listview td {
        border: 1px solid #95bce2;
    }

/*    table.listview tr.alt td {
        background: #ecf6fc;
    }*/

/*    table.listview tr.over td {
        background: #bcd4ec;
    }*/
    table.listview tr:nth-child(even) {
        background: #ecf6fc;
    }

    table.listview tr:hover {
        background-color: #bcd4ec;
    }

#resizable {
    width: 400px;
    height: 500px;
    padding: 0.1em;
}

    #resizable h3 {
        text-align: center;
        margin: 0;
    }


.CSSHLSel {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #333;
    display: block;
    font-size: 16px !important;
    height: 34px;
    line-height: 1.42857;
    padding: 6px 6px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}

    .CSSHLSel:focus {
        border-color: #66afe9;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
        outline: 0 none;
    }

.CSSHLText {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #333;
    display: block;
    font-size: 16px !important;
    height: 32px;
    line-height: 1.42857;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}

    .CSSHLText:focus {
        border-color: #66afe9;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
        outline: 0 none;
    }

.Copyright {
    background-color: White;
    position: absolute;
    z-index: 50;
    right: 0px;
    opacity: 0.60;
    filter: alpha(opacity=60);
}

.custom-combobox {
    position: relative;
    display: inline-block;
}

.custom-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;
}

.custom-combobox-input {
    margin: 0;
    padding: 5px 10px;
    width: 11.5em;
    height: 34px;
    font-size:16px !important;
}

.ui-autocomplete {
    max-height: 300px;
    /*max-height: calc(100% - 560px);*/
    /*min-height: 140px;*/
    overflow-y: auto;   /* prevent horizontal scrollbar */
    overflow-x: hidden; /* add padding to account for vertical scrollbar */
    z-index:1000 !important;
}
/*.custom-combobox-css > input
{ 
    width: 13em;
    height: 34px;
}*/

#mapDiv .tooltip {
    word-wrap: break-word;
    border: 1px solid #7EABCD;
    background-color: white;
    padding: 5px;
    font-size: 9pt;
    z-index: 9999;
    border-radius: 4px;
}

.menu{
    overflow:hidden;
}

.ui-menu-item{
    font-size:16px !important;
}

.ROAD1_0101 {
    width: 220px !important;
}
.LANDSEC2_0101 {
    width: 220px !important;
}


.modal {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2100;
    width: 400px;
    height: 300px;
    background-color: white;
    transform: translate(-50%,-50%);
    display: none;
    border: 10px solid #4297d7;
    text-align:center;
}
.modal-t2 {
    position: absolute;
    bottom: 8%;
    left: 50%;
    transform: translateX(-50%);
    width:250px;
}
#rClient {
    top: 50%;
    left: 50%;
    position: absolute;
    transform: translate(-50%,-50%);
}
.modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: .5;
    display: none;
}

.no-close .ui-dialog-titlebar-close {
    display: none;
}

#divusememo{
    padding-top:5px;
}

    #divusememo table {
        background-color: #FFF;
        border-collapse: collapse;
        width: 100%;
        text-align: left;
        font-size: 12px;
        border: 1px solid rgb(55, 211, 255);
    }
        #divusememo table tr:nth-child(1) th {
            width: 50%;
        } 
        #divusememo table th {
            text-align: center;
            background: #1f8782;
            color: #ffffff;
            font-weight: bold;
            border: 1px solid #ffffff;
            padding-top: 5px;
            padding-right: 0px;
            padding-bottom: 5px;
            padding-left: 0px;
        }
        #divusememo table td {
            border: 1px solid #95bce2;
        }


.ui-accordion-header-icon {
    position: absolute;
    left: .5em;
    top: 50%;
    margin-top: -8px;
}