body {
}
.logo {
    width:40px;
    margin-top:-4px;
    margin-bottom:-4px;
}
.logo-title {
    position: absolute;
    top: 20px;
    font-family: "標楷體";
    text-shadow: 2px 2px 0 #7b68ee, -1px 1px 0 #7b68ee, -1px -1px 0 #7b68ee, 1px -1px 0 #7b68ee;
    text-shadow: 2px 2px 0 #eee, -1px 1px 0 #87cefa, -1px -1px 0 #87cefa, 1px -1px 0 #ccc;
    font-style: oblique;
}
/********override css**********/
#mainmenu > .container > .navbar-collapse > .nav {
    margin-right:1em;
}
.navbar-inverse .navbar-nav > li > a {
    color: #fff;
    font-weight: bold;
    text-shadow: 1px -1px 0 #40659e,-1px 1px 0 #40659e,-1px -1px 0 #40659e,1px 1px 0 #40659e;
    text-shadow: 1px -1px 0 #191970,-1px 1px 0 #191970,-1px -1px 0 #191970,1px 1px 0 #191970;
   
}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
  color: #ff0;
  text-shadow: 1px -1px 0 #88a,-1px 1px 0 #88a,1px 1px 0 #88a;
  background-color: transparent;
}
#mainmenu .navbar-header h3 {
    margin-top:8px;
}
.tools-group-panel {
    padding-top:20px !important;
}
.base-background,.btn-hotel,.coordinateInfoPanel:first-child div { /*參考http://charliepark.org/bootstrap_buttons/*/
  background-color: #87cefa !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#7a7a7a", endColorstr="#87cefa");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#7a7a7a), to(#87cefa));
  background-image: -moz-linear-gradient(top, #7a7a7a, #87cefa);
  background-image: -ms-linear-gradient(top, #7a7a7a, #87cefa);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7a7a7a), color-stop(100%, #87cefa));
  background-image: -webkit-linear-gradient(top, #7a7a7a, #87cefa);
  background-image: -o-linear-gradient(top, #7a7a7a, #87cefa);
  background-image: linear-gradient(#7a7a7a, #87cefa);
  border-color: #2a2a2a #2a2a2a #87cefa;
  color: #444 !important;
  box-shadow: 0 0 5px rgb(255,255,255);
  -webkit-font-smoothing: antialiased;
}

.btn-hotel,.coordinateInfoPanel:first-child div {
  box-shadow: 0 0 5px rgb(30,30,30);
}
.coordinateInfoPanel {
    background-color: rgba(122,122,122,.8);
}
.coordinateInfoPanel > div >table >tbody {
    color: #112;
    font-weight:bold;
}
.auto-append-header::before {
    color:#667 !important;
}
.color-base {
    color:#444;
}
.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
    /*color: #555;*/
    border-radius: 5px 5px 0 0;
    filter:none;
    background-image: none;
}
.navbar-inverse .nav .open>a, .navbar-inverse .nav .open>a:hover, .navbar-inverse .nav .open>a:focus {
    background-color: transparent;
}
/**************************/


.popu-full-container,.popu-map {
    width:100%;
    height:calc( 100% - 30px );
}
.use-fun-ctrl .popu-full-container {
       height:100%;
}
.tooltip.right .tooltip-arrow,.tooltip.left .tooltip-arrow {
    border-right-color: rgba(0,0,0,.5) !important;
}
.tooltip.right .tooltip-inner,.tooltip.left .tooltip-inner{
    background-color: rgba(0,0,0,.5) !important;
    text-align: left;
}
/*.tooltip.right .tooltip-arrow,.tooltip.left .tooltip-arrow {
    border-right-color: rgba(0,0,0,.5) !important;
}
.tooltip.right .tooltip-inner,.tooltip.left .tooltip-inner{
    background-color: rgba(0,0,0,.5) !important;
        text-align: left;
}*/
/******災害資訊flood-query******/
.flood-query {
    overflow-y: auto;
    height:100%;
}

.flood-query .item-title{
    padding-top:3px;
    margin-bottom: 5px;
}
.flood-query .bootstrap-datetimepicker-widget {
    color:black;
    /*font-size:.85em;*/
}
.flood-query > .col-md-12,.flood-query > .col-md-offset-3 {
    clear:both;
    
    padding-right:0;
    margin-bottom:4px;
    margin-right: 0px;
}
.flood-query > .col-md-offset-3 {
    margin-left:25%;
}
.flood-query .floodarea-dom .legend {
    display:none;
}

@media (max-width: 768px) {
    .flood-query > .col-md-12,.flood-query > .col-md-offset-3 {
        padding-right:24px;
    }
}
.rvb-river-select-container {
    width: 100%;
    display: inline-block;
}
.flood-query .rvb-river-select-container{
    width:75%;
}
.rvb-river-select-container > .rvb-select {
    width: 40%;
}
.rvb-river-select-container > *{
    display:inline;
}

.rvb-river-select-container > .river-select {
    width: 60%;
}
.flood-query .rvb-river-select-container > .rvb-select, .flood-query .rvb-river-select-container > .river-select {
    padding-left: 2px;
    padding-right: 0;
}

.flood-query > .col-md-12 > select.form-control {
    width: 75%;
}
/*.flood-query > .col-md-12.river-select-container > select.form-control:nth-child(2) {
    width: 35%;
    padding-left:0;
    padding-right:0;
}
.flood-query > .col-md-12.river-select-container > select.form-control:nth-child(3) {
    width: 40%;
    padding-left: 2px;
    padding-right:0;
}*/
.flood-query > .col-md-12 > .opacity-label {
    padding:0;
    width:50px;
}
.flood-query > .col-md-12 > .ui-slider {
    margin-top:6px;
    width:calc( 100% - 50px );
}
.flood-query > .row.col-md-12 .data-type-group {
    padding-left:0;
}

.flood-query select.wra-event-year {
    width:32%;
    margin-left:-4px;
    margin-bottom:4px;
    padding: 6px 6px;
}
.flood-query select.wra-events {
    width:63%;
    padding-left:2px;
    padding-right:2px;
    margin-bottom:4px;
}

.flood-query .pin-積淹水區域 > .legend {
    display:none;
}
.flood-query-infowindow > .tab-content {
    border: 1px solid #ddd;
    border-bottom-width: 0;
    min-width:270px;
    /*min-height:120px;*/
}
.flood-query-infowindow >.nav > li > a {
    padding: 4px 8px;
    font-weight: bold;
}
 .flood-query-infowindow > .href-flood-data > .dowloap-kmz {
    display: none;
}
.flood-query-infowindow > .href-flood-data > .kmz-export {
    width:16px;
    height:16px;
    cursor:pointer;
    margin-left:2px;
}
.package-kmz-container {
    padding-left: 6px !important;
    padding-right 6px !important;
}
.flood-query .package-kmz {
    width: 30px;
    height: 30px;
    cursor: pointer;
}
.flood-query .package-kmz:hover, .href-flood-data > .kmz-export:hover {
    border-radius:4px;
    box-shadow: 0 0 4px gray;
}
.flood-query-infowindow > .href-flood-data, .flood-query-infowindow > .href-flood-data > .dowloap-kmz {
    position: absolute;
    right: 2px;
    bottom: 10px;
}
.googleContentFix > .flood-query-infowindow > .href-flood-data > .glyphicon {
    cursor: pointer;
    width:1.8em;
    top:0.4em;
}
.googleContentFix > .flood-query-infowindow .meterInfoTemplateContent table td{
    padding:2px;
}
.googleContentFix > .flood-query-infowindow  .affect-container .meterInfoTemplateContent table td{
    padding:4px 2px;
}

.item-title{
    color:#777;
    border-bottom: #aaa;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    padding-top:6px;
    clear:both;
    margin-bottom:2px;
}

/******人工圈繪hand-draw-flood******/
/*#HandDrawFloodPanel {
    height:100%;
}*/
.hand-draw-flood {
    overflow-y: auto;
    overflow-x:hidden;
    height: 100%;
    width:100%;
}
.hand-draw-flood > .col-md-12 {
    padding:0;
    margin-top:4px;
}
@media (max-width: 768px) {
    .hand-draw-flood > .col-md-12 {
        padding-right:16px;
    }
}
/*.hand-draw-flood > .col-md-12.col-large-field + .col-md-12 {
    margin-top: -2px;
}*/
.hand-draw-flood > .col-md-12 > .col-field{
    padding-right: 0;
    margin-top: 5px;
}
.hand-draw-flood > .col-md-12.col-large-field > .col-field{
    margin-top: 2px;
    line-height:1;
}
.hand-draw-flood > .col-md-12 > .col-value{
    padding: 0;
}
.hand-draw-flood > .col-md-12.btn-ctrl > div {
    padding-left:16px;
    padding-right:0;
}
.hand-draw-flood > .col-md-12.btn-ctrl > div > .btn {
    width:100%;
}
.hand-draw-flood .address-deocode {
    margin-left:0;
}
.hand-draw-flood .bootstrap-datetimepicker-widget {
            font-size:.7em;
    }
/******災害資訊-統計資料******/
.flood-statistics-table-container .table-striped>tbody>tr:nth-of-type(odd),.facility-statistics-table-container .table-striped>tbody>tr:nth-of-type(odd),.land-use-district-statistics-table-container .table-striped>tbody>tr:nth-of-type(odd){
    background-color: #e0e0ff;
}
.flood-statistics-table-container .table-striped>tbody>tr:hover,.facility-statistics-table-container .table-striped>tbody>tr:hover,.land-use-district-statistics-table-container .table-striped>tbody>tr:hover{
    background-color: #aaf;
}
.flood-statistics-table-container .tilte-div ,.facility-statistics-table-container .tilte-div ,.land-use-district-statistics-table-container .tilte-div {
    font-weight:bold;
    font-size:1.2em;
}
.flood-statistics-table-container  .tilte-div a, .land-use-district-statistics-table-container .tilte-div a {
    float: right;
    cursor: pointer;
}
.land-use-district-statistics-table-container .table-striped > tbody > tr > td {
    white-space:nowrap;
}
.flood-statistics-table-container .bootstrap-table thead {
        background-color: #ccd !important;
}
.flood-statistics-table-container  .fixed-table-container {
    border: 1px solid #bbd;
}
.flood-statistics-table-container .fixed-table-container table tr>td:first-child{
    white-space:nowrap !important;
}

.flood-statistics-table-container .fixed-table-container table > tbody > tr > td{
    padding:4px 8px;
}
/******分析資料typh-type-village-alert******/
/*.village-disaster-history .item-title{
    color:#aaa;
    border-bottom: gray;
    border-bottom-width: 1px;
    border-bottom-style: solid;
     padding-top:6px;
}*/
.typh-type-village-alert > .col-md-12 {
    margin-top: 4px;
    /*float:left;*/
    clear: both;
}
.typh-type-village-alert > .col-md-12 > div[class*='col'],.typh-type-village-alert>.pin-container > .col-md-12 > div[class*='col'] {
    padding-left:0;
    padding-right:0;
}
.typh-type-village-alert > .col-md-12 > .pre-label {
    text-align:right;
    padding: 6px;
}
.typh-type-village-alert > .col-md-12 > .pre-label + div + div {
    padding: 6px;
}

.typh-type > div:first-child > div:first-child img,.typh-type  #typhtypemap{
    /*width:50%;*/
    height:calc( 100% );
    margin: 0;
    padding: 0;
}
.typh-type > div:first-child > div:first-child img {
    width:calc( 100% );
}
.typh-type > div, .typh-type > div > div {
    padding:0;
}
.typh-type > .typh-name {
    position: absolute;
    left: 50%;
    margin-left: 2px;
    text-shadow: 1px 1px 5px black;
    color: black;
}
#TyphTypePanel {
    /*height: calc( 100% - 30px ) !important;*/
    height:100%;
    min-height:auto !important;
}
/*.typh-type > #typhtypemap{
    width:50%;
    height:100%;
}*/

.status_51B500 {
    background-color:#51B500;
    fill:#51B500;
    color:black;
    /*text-shadow:0 0 2px white;*/
}
.status_6FC400 {
    background-color:#6FC400;
    fill:#6FC400;
    color:black;
}
.status_8BD100 {
    background-color:#8BD100;
    fill:#8BD100;
    color:black;
}
.status_B0E000 {
    background-color:#B0E000;
    fill:#B0E000;
    color:black;
}
.status_D8F000 {
    background-color:#D8F000;
    fill:#D8F000;
    color:black;
}
.status_FFFF00 {
    background-color:#FFFF00;
    fill:#FFFF00;
    color:black;
}
.status_FFD500 {
    background-color:#FFD500;
    fill:#FFD500;
    color:black;
}
.status_FFAA00 {
    background-color:#FFAA00;
    fill:#FFAA00;
    color:black;
}
.status_FF8000 {
    background-color:#FF8000;
    fill:#FF8000;
    color:black;
}
.status_FF5500 {
    background-color:#FF5500;
    fill:#FF5500;
    color:white;
}
.status_FF2B00 {
    background-color:#FF2B00;
    fill:#FF2B00;
    color:white;
}
.status_FF0000 {
    background-color:#FF0000;
    fill:#FF0000;
    color:white;
}

.status_ADD8E6 {
    background-color:#ADD8E6;
    fill:#ADD8E6;
    color:black;
}
.status_0000FF {
    background-color:#0000FF;
    fill:#0000FF;
    color:black;
}
.status_00008B {
    background-color:#00008B;
    fill:#00008B;
    color:black;
}
/******災害履歷village-disaster-history******/

.village-disaster-history > .col-md-12 {
    padding:4px 6px;
}
.village-disaster-history > .col-md-12.year-container> * {
    /*padding:2px 6px;*/
    padding:0;
}
.village-disaster-history > .col-md-12.year-container select {
    width:calc(100% - 30px);
    float:right;
}
.village-disaster-history .meter {
    padding:0;
}

.village-disaster-history .meter > .ui-slider {
    clear:both;
}

.village-disaster-history .jsPanel {
            height: 100% !important;
            width:100% !important;
            top: 6px !important;
            left: 0 !important;
            bottom: -46px !important; /*隱藏jsPanel-hdr*/
            padding: 0 !important;
            position:  relative !important;
        }

.village-disaster-history .jsPanel .jsPanel-content {
    height: calc(100% - 360px);
    padding:0;
}
.village-disaster-history .jsPanel > .jsPanel-hdr {
    height:26px;
}
.village-disaster-history .jsPanel > .jsPanel-hdr > .jsPanel-hdr-l, .village-disaster-history .jsPanel > .jsPanel-hdr > .jsPanel-hdr-r {
    display:none;
}
.village-disaster-history  .fixed-table-container thead th .th-inner {
    color:black;
    text-shadow:none;
    font-weight:bold;
}
.village-disaster-history .metertable .fixed-table-container{
        border: 1px gray solid;
    border-radius: 4px;
}
.village-disaster-history .pin-村里 .legend {
    display:none;
}
.village-disaster-history .red_status {
    background-color: red;
    /* fill: red; */
    background-color: white;
    color: red;
}
.village-disaster-history .metertable .table > tbody > tr.red_status > td {
    color: red;
    text-shadow: none;
}

.village-disaster-history .jsPanel-hdr .jsPanel-hdr-toolbar .meter-list-count {
    color: gray;
}
.googleContentFix > .village-disaster-history-infowindow {
    /*min-height:180px;*/
    /*position: relative;*/
}
.googleContentFix > .village-disaster-history-infowindow .村里-info-content img {
    width: 18px;
    height: 18px;
    cursor: pointer;
    margin-right: 2px;
    margin-right: 2px;
}
/*.googleContentFix > .village-disaster-history-infowindow > ul {
    position: absolute;
    bottom: 0;
}*/
    .googleContentFix > .village-disaster-history-infowindow >.nav > li > a {
    padding: 4px 8px;
}
.googleContentFix > .village-disaster-history-infowindow > .tab-content {
    /*border: 1px solid #ddd;*/
    border-bottom-width: 0;
     min-height:160px;
}
.googleContentFix > .village-disaster-history-infowindow > .tab-content .bootstrap-table .table>thead>tr>th, .table>tbody>tr>td, .table>tbody>tr>th,
.googleContentFix > .village-disaster-history-infowindow > .tab-content .bootstrap-table .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, 
.googleContentFix > .village-disaster-history-infowindow > .tab-content .bootstrap-table .fixed-table-container,
.googleContentFix > .village-disaster-history-infowindow > .tab-content .bootstrap-table table
{
    border:0;
}

.googleContentFix > .village-disaster-history-infowindow > .tab-content > .tab-pane > .rain-chart {
    /*width:280px;
    height:250px;*/
    margin:0 auto;
}
.googleContentFix > .village-disaster-history-infowindow > .tab-content > .tab-pane > .rain-chart .highcharts-tooltip + text{
    display:none !important;
}
.googleContentFix > .village-disaster-history-infowindow > .tab-content > .tab-pane > .bootstrap-table {
    padding:2px;
}
.googleContentFix > .village-disaster-history-infowindow > .tab-content > .tab-pane > .bootstrap-table > .fixed-table-container > .fixed-table-body > table > thead > tr > th > .th-inner,
.googleContentFix > .village-disaster-history-infowindow > .tab-content > .tab-pane > .bootstrap-table > .fixed-table-container > .fixed-table-body > table  td {
    padding:3px 4px !important;
}
.googleContentFix > .village-disaster-history-infowindow.ev-rain-1 > .tab-content > .tab-pane > .bootstrap-table > .fixed-table-container > .fixed-table-body > table > thead > tr > th > .th-inner,
.googleContentFix > .village-disaster-history-infowindow.ev-rain-1 > .tab-content > .tab-pane > .bootstrap-table > .fixed-table-container > .fixed-table-body > table  td {
    padding:15px 4px !important;
}
.googleContentFix > .village-disaster-history-infowindow.ev-rain-2 > .tab-content > .tab-pane > .bootstrap-table > .fixed-table-container > .fixed-table-body > table > thead > tr > th > .th-inner,
.googleContentFix > .village-disaster-history-infowindow.ev-rain-2 > .tab-content > .tab-pane > .bootstrap-table > .fixed-table-container > .fixed-table-body > table  td {
    padding:8px 4px !important;
}
.googleContentFix > .village-disaster-history-infowindow.ev-rain-3 > .tab-content > .tab-pane > .bootstrap-table > .fixed-table-container > .fixed-table-body > table > thead > tr > th > .th-inner,
.googleContentFix > .village-disaster-history-infowindow.ev-rain-3 > .tab-content > .tab-pane > .bootstrap-table > .fixed-table-container > .fixed-table-body > table  td {
    padding:5px 4px !important;
}
/*.googleContentFix > .village-disaster-history-infowindow.ev-rain-3 > .tab-content > .tab-pane.event-container td {
}*/

.googleContentFix > .village-disaster-history-infowindow.ev-1 > .tab-content > .tab-pane > .meterInfoTemplateContent  td{
    padding:4px 0;
}
.googleContentFix > .village-disaster-history-infowindow.ev-2 > .tab-content > .tab-pane > .meterInfoTemplateContent  td{
    padding:3px 0;
}
.googleContentFix > .village-disaster-history-infowindow > .nav-tabs {
    font-weight: bold;
}
.googleContentFix > .village-disaster-history-infowindow .rain-chart {
        /*width: 300px;
    height: 240px;*/
    /*min-width: 310px; height: 400px; margin: 0 auto*/
}
/******動態災情資訊perHourData******/
.per-hour-data .mainmap {
    height:100%;
    width:calc( 100% - 360px );
    border:1px #aaa solid;
    float:left;
}
.use-fun-ctrl .per-hour-data .mainmap {
    display:none;
}
.per-hour-data .right-ctrl {
    background-color: #87cefa;
    height:100%;
    width:360px;
    float:right;
    padding:0;
}
.use-fun-ctrl .per-hour-data .right-ctrl {
    width:auto;
}
.per-hour-data .typhmap {
    height:360px;
    width:100%;
}

@media (max-width: 768px) {
    #PerHourDataPanel {
        padding:0;
    }
    .popu-ctrl-container.full-for-minscreen-popu-ctrl .jsPanel-PerHourDataPanel {
        z-index:99999;
        width: 100% !important;
        top: 0 !important;
        height: 100% !important;
        left: 0 !important;
    }
    .popu-ctrl-container.full-for-minscreen-popu-ctrl .jsPanel-PerHourDataPanel .per-hour-data > .full-zoom {
        display:none;
    }
    #PerHourDataPanel .popu-full-container {
        height:100%;
        width:94%;
        margin:0 auto;
    }
    .per-hour-data .mainmap {
        width:100%;
        /*margin:0 auto;*/
    }
    .per-hour-data .right-ctrl {
        width:100%;
        /*margin:0 auto;*/
        float:none;
        height:auto;
        box-shadow: 0 0 10px black;
    }
    .per-hour-data .ctrl-container {
        min-height:250px;
        height: auto !important;
    }
    .jsPanel-PerHourDataPanel .jsPanel-content {
        height: calc( 100% - 36px ) !important;
    }
}
.display-none {
    display:none;
}

.per-hour-data .ctrl-container {
    background-color:#87cefa;/*rgba(0,0,0,.9);*/
    height: calc( 100% - 360px );
    /*height:auto;*/
    width:100%;
    overflow-y:auto;
}

 .ctrl-container .auto-append-header {
    margin-bottom: 6px;
}
.popu-full-container.per-hour-datap {
    height: calc( 100% - 30px );
}

.per-hour-data .full-zoom {
    position:absolute;
    /*content: url(../../images/out.png);*/
    top: 7px;
    left: 9px;
    border-radius:0 0 4px 0;
    bottom:0;
    z-index:9999;
    width:26px;
    height:26px;
    padding:1px;
    border-left-width: 0;
    border-top-width: 0;
    font-size:1.5em;
    box-shadow: black 1px 1px 4px;
}
.use-fun-ctrl .per-hour-data .full-zoom {
    display:none;
}
.per-hour-data .full-zoom > .glyphicon-resize-small {
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.per-hour-data .item-title{
    width: calc( 100% - 30px );
    margin-left: 14px;

}
.per-hour-data .meter {
    padding:0 12px;
}
.per-hour-data .meter > .pinctrl {
    padding-right:2px;
    padding-bottom:0;
}
.per-hour-data .meter .pinctrl:not(.pin-雨量站) > .legend {
    display:none;
}
.per-hour-data .meter > .pinctrl > .ctrl > .col-xs-6 {
    width:100%;
    padding-right:2px;
}
.per-hour-data .meter > .pinctrl > .ctrl > .col-xs-6 > .pinswitch + span + .checkbox-name > .ext-message{
    display:none;
}
.per-hour-data .meter > .pinctrl > .ctrl > .col-xs-6 > .pinswitch:checked + span + .checkbox-name > .ext-message{
    display:inline;
}

.per-hour-data .pin-雨量站 > .ctrl {
    margin-top:4px;
    padding-bottom:0;
}
.per-hour-data .pin-雨量站 .legend .legend-icon > img {
    width:14px;
    height:14px;
    margin-top:-4px;
}
.popu-ctrl-container.full-for-per-hour-data,.jsPanel.full-for-per-hour-data {
    z-index:99999;
    width: 100% !important;
    height:100% !important;
}
@media (max-width: 768px) {
    .popu-ctrl-container.full-for-minscreen-popu-ctrl{
        z-index:99999;
        width: 100% !important;
        top: 0 !important;
        height: 100% !important;
        left: 0 !important;
    }
}
.jsPanel.full-for-per-hour-data  {
    z-index:99999 !important;
    opacity:1;
    top:0 !important;
    left:0 !important;
}
.jsPanel.full-for-per-hour-data .jsPanel-hdr {
    display:none;
}

.jsPanel.full-for-per-hour-data .popu-full-container {
    height:100%;
}
#PerHourDataPanel .googleContentFix {
    color:black;
}
/******動態災情資訊perHourData******/

.googleContentFix .title {
    /*top:-5px;*/
}
/*****堰塞湖******/
.meterInfoTemplateContent.forestLake-info-content>table>tbody > tr > td:nth-child(2) ,
.meterInfoTemplateContent.wraLake-info-content>table>tbody > tr > td:nth-child(2) {
    padding-left:4px;
}
.meterInfoTemplateContent.forestLake-info-content>table>tbody > tr > td:nth-child(2) > span,
.meterInfoTemplateContent.wraLake-info-content>table>tbody > tr > td:nth-child(2) > span {
    margin-right: 0;
}
.meterInfoTemplateContent.forestLake-info-content > table > tbody > tr > td:nth-child(2) > span > .lake-description,
.meterInfoTemplateContent.wraLake-info-content > table > tbody > tr > td:nth-child(2) > span > .lake-description {
    white-space: normal;
}
.lake-description {
    max-width:260px;
}

#LakePanel.meter .legend .legend-icon > img {
    width: 24px;
    height: 24px;
    
}

/*******左邊控制項******/
.fun-target-ctrl {
    position: fixed;
    left: -320px;
    top: 50px;
    bottom: 0;
    background-color:#87cefa;
    width: 320px;
    overflow: inherit;
    -moz-transition: left .5s,top .5s;
    -o-transition: left .5s,top .5s;
    -webkit-transition: left .5s,top .5s;
    transition: left .5s,top .5s;
    padding:10px 10px 4px 10px; 
    display:block !important;
    color:#444;
}
.fun-target-ctrl.fun-ctrl-fullsereen {
    left:-100%;
    width:100%;
}
.fun-target-ctrl > ul > li > a {
    color:blue !important;
    font-weight:bold;
}
.fun-ctrl-fullsereen.selected > .fun-show-ctrl {
    /*display:none !important;*/
    right: 0 !important;
}

#mainmenu[style*="display: none"] + div + #map + .popu-ctrl-container .fun-target-ctrl {
    top:0;
}
.fun-target-ctrl.selected {
     /*border: 1px solid gray;*/
    /*box-shadow: blue 4px 0 10px orchid;*/
    left:0;
    z-index:99;
    box-shadow: 0 0 5px rgb(255,255,255);
}
.fun-target-ctrl > .fun-show-ctrl {
    position: absolute;
    top:0;
    right: -1.95em;
    border-top: 0;
    border-left: 0;
    border-radius: 0 0 4px 0;
    margin: 0 0 0 6px;
   display:none;
   width:2em;
   height:2em;
   background-color: #87cefa;
}
@media (max-width: 768px) {
    .fun-target-ctrl {
        left: calc(  15% - 100% ) ; 
        width: calc( 100% - 15% );
    }
    .fun-target-ctrl > .fun-show-ctrl {
        /*right: -3em;
        width:3em;
        height:3em;*/
        font-size:1.4em;
    }
}
.fun-target-ctrl.active > .fun-show-ctrl {
    display:block;
}
.fun-target-ctrl.selected > .fun-show-ctrl {
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    border-radius: 4px 0 0 0;
    /*box-shadow: -2px -2px 5px rgb(255,255,255);*/
    border: none;
    box-shadow: -2px -1px 5px rgb(255,255,255);
}
/*******左邊控制項******/
.gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom {
    /*bottom:117px !important;*/
    display:none;
}
.gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom > .gmnoprint {
    display:none;
}

/*.gmnoprint div[title='放大'],
.gmnoprint div[title='縮小'] {
    display:none;
}*/

/*bootstrap table css*/
/* custom inclusion of right, left and below tabs */

.tabs-below > .nav-tabs,
.tabs-right > .nav-tabs,
.tabs-left > .nav-tabs {
  border-bottom: 0;
}

.tab-content > .tab-pane,
.pill-content > .pill-pane {
  display: none;
}

.tab-content > .active,
.pill-content > .active {
  display: block;
}

.tabs-below > .nav-tabs {
  border-top: 1px solid #ddd;
}

.tabs-below > .nav-tabs > li {
  margin-top: -1px;
  margin-bottom: 0;
}

.tabs-below > .nav-tabs > li > a {
  -webkit-border-radius: 0 0 4px 4px;
     -moz-border-radius: 0 0 4px 4px;
          border-radius: 0 0 4px 4px;
}

.tabs-below > .nav-tabs > li > a:hover,
.tabs-below > .nav-tabs > li > a:focus {
  border-top-color: #ddd;
  border-bottom-color: transparent;
}

.tabs-below > .nav-tabs > .active > a,
.tabs-below > .nav-tabs > .active > a:hover,
.tabs-below > .nav-tabs > .active > a:focus {
  border-color: transparent #ddd #ddd #ddd;
}

.tabs-left > .nav-tabs > li,
.tabs-right > .nav-tabs > li {
  float: none;
}

.tabs-left > .nav-tabs > li > a,
.tabs-right > .nav-tabs > li > a {
  min-width: 74px;
  margin-right: 0;
  margin-bottom: 3px;
}

.tabs-left > .nav-tabs {
  float: left;
  margin-right: 19px;
  border-right: 1px solid #ddd;
}

.tabs-left > .nav-tabs > li > a {
  margin-right: -1px;
  -webkit-border-radius: 4px 0 0 4px;
     -moz-border-radius: 4px 0 0 4px;
          border-radius: 4px 0 0 4px;
}

.tabs-left > .nav-tabs > li > a:hover,
.tabs-left > .nav-tabs > li > a:focus {
  border-color: #eeeeee #dddddd #eeeeee #eeeeee;
}

.tabs-left > .nav-tabs .active > a,
.tabs-left > .nav-tabs .active > a:hover,
.tabs-left > .nav-tabs .active > a:focus {
  border-color: #ddd transparent #ddd #ddd;
  *border-right-color: #ffffff;
}

.tabs-right > .nav-tabs {
  float: right;
  margin-left: 19px;
  border-left: 1px solid #ddd;
}

.tabs-right > .nav-tabs > li > a {
  margin-left: -1px;
  -webkit-border-radius: 0 4px 4px 0;
     -moz-border-radius: 0 4px 4px 0;
          border-radius: 0 4px 4px 0;
}

.tabs-right > .nav-tabs > li > a:hover,
.tabs-right > .nav-tabs > li > a:focus {
  border-color: #eeeeee #eeeeee #eeeeee #dddddd;
}

.tabs-right > .nav-tabs .active > a,
.tabs-right > .nav-tabs .active > a:hover,
.tabs-right > .nav-tabs .active > a:focus {
  border-color: #ddd #ddd #ddd transparent;
  *border-left-color: #ffffff;
}

#ForecastVillageAlertInfoPanel {
    background-color:white;
}
#ForecastVillageAlertInfoPanel .result-container {
        /*height:calc( 100% - 30px );*/
        height:100%;
}
#ForecastVillageAlertInfoPanel  .result-container > .title {
        height:30px;
        background-color:lightgray;
}
        
#ForecastVillageAlertInfoPanel  .result-container > .map-container {
    height:calc( 100% - 30px );
}
/*.popu-ctrl-container.full-for-minscreen-popu-ctrl {
    z-index:999;
         
}*/
#ForecastVillageAlertInfoPanel > .col-sm-5 {
    padding-left:0;
    padding-right:6px;
}

/*.popu-ctrl-container.full-for-minscreen-popu-ctrl .popu-ctrl.selected, .popu-ctrl[style*="position: relative"] {
        opacity:1;
}*/
#ForecastVillageAlertInfoPanel .ctrl-container {
    max-height:100%;
    overflow-y:auto;
}
#ForecastVillageAlertInfoPanel .ctrl-title {
    color:#555;
    width:100%;
    border-bottom:1px #555 solid
            
}
#ForecastVillageAlertInfoPanel .ctrl-title:not(:first-child) {
    margin-top:6px;
}
#ForecastVillageAlertInfoPanel .form-control.pull-right {
    width: auto;
    height: 30px; 
    padding: 4px 12px;
}

/*panel*/
#ForecastVillageAlertInfoPanel .panel-group {
    margin-bottom: 6px;
}
#ForecastVillageAlertInfoPanel .panel {
    box-shadow:none;
    border:none;
}
#ForecastVillageAlertInfoPanel .panel-body {
    padding: 0;
    padding-top:2px;
}
#ForecastVillageAlertInfoPanel .panel-heading {
    padding:0;
}
#ForecastVillageAlertInfoPanel .panel-title {
    font-size:1em;
}
#ForecastVillageAlertInfoPanel .panel-info>.panel-heading {
    background-color: transparent;
    }
#ForecastVillageAlertInfoPanel .bootstrap-table .table:not(.table-condensed) >tbody>tr>td,
#ForecastVillageAlertInfoPanel .fixed-table-container thead th .th-inner{
    padding:4px 8px !important;
}
@media (max-width: 768px) {
        #ForecastVillageAlertInfoPanel > .col-sm-5 {
        padding-left:15px;
        padding-right:15px;
    }
    #ForecastVillageAlertInfoPanel .ctrl-container {
        max-height:auto;
    }
}

.stage-subject {
    font-size:1.6em;
    font-weight:bold;
}

.disaster-stage .pre-label {
    text-align:right;
    padding: 6px;
}

.pin-list-container-積淹水點位 .metertable .fixed-table-body {
    overflow-x:auto;
}

/*雨量資訊*/
/*#RainInfoPanel  {
    overflow:auto;
}*/
#RainInfoPanel > .sgds-rain-info > .row {
    margin-bottom:4px;
    margin-left:0;
    margin-right:0;
    padding:0;
}
#RainInfoPanel > .sgds-rain-info > .row > [class*="col-"]:not(.pinctrl) {
    padding:0;
}

#RainInfoPanel > .sgds-rain-info > .row > .wra-event-year{
    width:25%;
}
#RainInfoPanel > .sgds-rain-info > .row > .wra-events {
    width:58%;
}
#RainInfoPanel > .sgds-rain-info > .row > .btn{
    padding:4px !important;
    width:100%;

}

/*#RainInfoPanel > .sgds-rain-info >.filter-label{
    background-color: #87cefa;
    margin-bottom:-10px;
    font-weight:100;
}*/
#RainInfoPanel > .sgds-rain-info > .filter-container{
    /*margin-top:-10px;*/
    /*padding:6px 2px 4px 2px;*/
    /*border: 1px #222 solid;*/
}
#RainInfoPanel > .sgds-rain-info > .filter-container [class*="col-"]{
    padding:0;
}
#RainInfoPanel > .sgds-rain-info > .filter-container  > label{
    width:36px;
}
#RainInfoPanel > .sgds-rain-info > .filter-container > select {
    width:36%;
    width:calc( 50% - 36px );
}

#RainInfoPanel .per-hour-data .right-ctrl{
    float:none;
} 

#RainInfoPanel .per-hour-data .typhmap{
    height:0px;
}
#RainInfoPanel .per-hour-data .ctrl-container {
    height: auto;
}

#RainInfoPanel .per-hour-data .ctrl-container .typh-select-container > select{
    display:block !important;
    padding: 8px !important;
    border: none;
}
#RainInfoPanel .per-hour-data .ctrl-container .typh-select-container > .bootstrap-select {
    display:none;
}
#RainInfoPanel .per-hour-data .item-title,#RainInfoPanel .per-hour-data .meter > .pinctrl:not(.pin-累計降雨){
    display: none;
}

#RainInfoPanel .per-hour-data .meter,#RainInfoPanel .per-hour-data  .typh-select-container > .col-xs-12 {
     padding: 0 !important;
}
#RainInfoPanel .per-hour-data .meter,#RainInfoPanel .per-hour-data  .typh-select-container > .typh-select-title{
    margin-bottom:-14px;
}

.googleContentFix > .sgds-rain-info-infowindow > div >.nav > li > a {
    padding: 4px 8px;
}

.sgds-rain-info-infowindow .fixed-table-container tbody td .th-inner, .sgds-rain-info-infowindow .fixed-table-container thead th .th-inner,
.sgds-rain-info-infowindow .bootstrap-table .table:not(.table-condensed) > tbody > tr > td{
    padding:2px 1px !important;
}
.sgds-rain-info-infowindow .fixed-table-container thead th .th-inner {
    line-height:14px;
}

.sgds-rain-info-infowindow .atable > tbody > tr > td{
        border-left: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
}
/*.sgds-rain-info-infowindow.by-event .雨量站-info-content{

}*/
.gm-pin-iw-container.gm-pin-iw-雨量站 .googleContentFix {
    max-width:none;
}

#RainInfoPanel > .sgds-rain-info > .typh-ctrl-container  .btn-group.bootstrap-select {
    /*height:0px !important;*/
    /*top: 0!important;*/
    /*position:relative !important;*/
}
#HistoryFloodArea .accordion-container{
    height: calc( 100% - 84px );
     overflow-y:auto;
     overflow-x:hidden;
}
#HistoryFloodArea .panel-group {
    margin-bottom: 4px;
}
#HistoryFloodArea .panel-group .panel{
    background-color:transparent;
}
#HistoryFloodArea .panel-group .panel-heading {
    background-color:rgba(255,255,255,.1);
    padding:4px 15px;
}
#HistoryFloodArea .panel-group .panel-heading a {
    display: block;
    width: 100%;
    cursor: pointer;
}
#HistoryFloodArea .panel-group .panel-body{
    padding:6px 15px;
}
/*.pin-積淹水點位:after{
    content:"備註:"
}
.pin-積淹水點位:after:after {
    content: "藍色-已退水;";
    color: blue;
}
.pin-積淹水點位:after:after:after {
    content: "紅色-未退水";
    color: red;
}*/