body { font-family:"微軟正黑體","Courier New", Courier, monospace;padding:0; margin:0;
    margin-top: 50px;    font-size: 16px;
    background-color: #fff;
}
hr{margin-top: 10px;
    margin-bottom: 10px;}
.page-header{margin:10px 0; color:#0153c2; padding-left:10px; border-left:5px solid #0153c2; border-bottom:none;}

@media(min-width:768px) {
    body {
        margin-top: 50px;
    }
}


#wrapper {
    padding-left: 0;
}

#page-wrapper {
    width: 100%;
    padding: 0;
}

.huge {
    font-size: 50px;
    line-height: normal;
}
.pernb{ position:absolute; top:2px; left:260px; margin:0; padding:2px 6px; font-size:13px; color:#ffff8a; background:rgba(0,0,0,.3); z-index:9999;}
.marqueesty{font-size:15px; color:#fff; background:rgba(0,0,0,.5);   z-index:9999;margin-top:-5px; margin-left:-8px; margin-right:-8px;margin-bottom:5px;}

@media(min-width:768px) {
    #wrapper {
        padding-left: 250px;
    }

    #page-wrapper {
        padding: 0px;
    }
	.rightbt{float:right;}
	.rightbt .btn{margin-right:5px}
}
.rightbt .btn{margin-right:5px;margin-top:5px;}
/*topmenu*/
.navbar{background:url(../img/background.jpg) #2498c0; height:50px;}
	ul.navigation .current {background:#0978b8;}
	.navigation {
		/* rules common to BOTH inner and outer UL */
		z-index:	10000;
		margin:		0;
		padding:	0;
		list-style:	none;
		cursor:		pointer;
		/* rules for outer UL only */
		right:2em;
	    bottom:0;
		position:absolute;
	}
	ul.navigation>li {
		float:left; margin:0; padding:0;background:#04a9da;
	}
	ul.navigation li img{ vertical-align:middle;}
	ul.navigation li a {
		display:block;
		color: #fff;
		line-height:50px;
		text-decoration: none;
		padding:0 1.2em;
		}
	ul.navigation li a:hover, .navigation li a:active{
		background:#03384b;
		}
	ul.navigation ul {
		display:	none;
		position:	absolute;
		right:		1px;
		/* Pop-Up */
		list-style:none;
		bottom:		0;
		margin:		0;
		padding:0;
		border:0;
		background:#007468;		
	}
	ul.navigation ul li a{ text-align:center; line-height:2.5em; }
	ul.navigation>li:hover>ul	{ display:block; margin:0; padding:0; right:0; }
	ul.navigation>li:hover>ul>li{ position:relative;width:150px;}
	ul.navigation>li:hover>ul>li a:hover{ background-color:#008979;}
	ul.navigation>li:hover>ul>li>ul{display:none; position:absolute;right:150px; top:-1px; width:150px; border:1px solid #fff;}
	ul.navigation>li:hover>ul>li>ul>li{border:0;}
	ul.navigation>li:hover>ul>li:hover>ul{display:block;}
	
	ul.navigation li .btfestival {background-color:#bd2c36; color:#fff; font-weight:bold;}
	.logo{display:block; width:258px; height:50px; text-indent: 100%; white-space: nowrap; overflow: hidden; background:url(../img/titlelogo.png) no-repeat left top;}
	.topform{padding:5px 8px;font-size:15px; line-height:25px; color:#111;}
	.topform h3{font-weight: 700; font-size:18px; color:#0f6fa9; margin:5px 0;}
	.topform p{ margin:0; padding:0;}
	.fontyellow{ color:#e52600;}

	
	select {
	  display: inline-block;
	  margin-bottom: 1px;
	  font-size: 14px;
	  padding:3px 0;
	  color: #555555;
	  -webkit-border-radius: 4px;
		 -moz-border-radius: 4px;
			  border-radius: 4px;
	}
	.navbar-inverse {
    border-color: #04a9da;
	
}


/* Side Navigation */
.side-nav{
	background: linear-gradient(to top right, #6abbe8, #c3e7fd);; 
}

@media(min-width:768px) {
	ul.navigation li:last-child{display:block;}
    .side-nav {
        position: fixed;
        top: 50px;
        left: 250px;
        width: 250px;
        margin-left: -250px;
        border: none;
        border-radius: 0;
        overflow-y: auto;
        bottom: 0;
        overflow-x: hidden;
        padding-bottom: 40px;
		background:url(../img/slider_bg.png) left bottom no-repeat,-webkit-linear-gradient(#c3e7fd, #6abbe8);
		background:url(../img/slider_bg.png) left bottom no-repeat,-o-linear-gradient(#c3e7fd, #6abbe8);
		background:url(../img/slider_bg.png) left bottom no-repeat,linear-gradient(#c3e7fd, #6abbe8);
    }
	.showlist {
	 position:absolute;
	 top:6.7em;
	 left:16.2em;
	}
	
}


/* ~~ 最新消息列表 ~~ */
.newspage{color:#495663; height:100%;margin:0;  overflow:auto;}
.newspage ul{ list-style:none; padding:0; font-size:1em;}
.newspage li{  padding:10px 5px 3px 5px; border-bottom:1px dotted #111;}
.newspage li a{ color:#2f2e2e; text-decoration:none;  padding-left:30px; background:url(../img/newspapers.png) no-repeat left 50%;}
.newspage li:nth-of-type(odd){ background-color:#f4faff;}
.newspage li:hover{ background-color:#c3e4fc;}
.newspage span.newDT{ color:#545b65; font-size:0.9em; float:right; padding:5px;}
.clearfix:after{ 
visibility: hidden; 
display: block; 
font-size: 0; 
content: "."; 
clear: both; 
height: 0; 
}
.newspage p{font-size:1.1em; text-indent:33px; line-height:30px; }

/*清運內容*/
.carnamber{ color:#fff600; font-size:1em; }
.garbageserch{ list-style:none; padding:5px 15px; margin:0; font-size:0.9em; background:#53a5d0; }
.garbageserch li{ padding:0.1em 1.8em; margin:0; border-bottom:1px dotted #fff; position:relative;}
.garbageserch h3{ color:#fff; padding:0; margin:0.3em 0; font-size:1.1em; text-shadow:1px 1px 2px #366;}
.garbageserch p{ color:#fff; padding:0; margin:0; margin-bottom:0.3em; font-size:1.1em;text-shadow:1px 1px 2px #111;}
.state1{ font-size:X-Small; font-weight:800; color:#0000ff;position:absolute; right:2em; top:0.4em; background:rgba(100,218,236,0.8)}
.state2{ font-size:1.2em; color:#d20000;position:absolute; right:1em; top:0.5em;}
.state3{ font-size:1em; color:#0000ff;position:absolute; right:1.5em; top:0.5em;}
.btn_infor{ display:block; position:absolute; left:-0.5em; top:1em;}
.btn_infor:hover, .btn_infor:action, .btn_gps:hover, .btn_gps:action{ box-shadow:1px 1px 3px #9F0;}
.btn_gps{ display:block; position:absolute; right:-0.5em; top:1em;}
.redfont{ color:#C00;}


/* Pager */
.page,.page2{ text-align:center; font-size:15px; margin:5px; padding:5px;  text-shadow:none; line-height:2.5em;}
.page p{color:#fff;}
.page2 p{color:#333;}
.page_page{ color:#defdff;}
.page_page2{ color:#C00;}
.page a, .page a:visited,.page2 a, .page2 a:visited{ color:#0088cc; background:#fff; padding:3px 8px; border:1px solid #ddd; border-radius:5px; text-decoration:none;white-space:nowrap;}
.page a.alt, .page2 a.alt{padding:3px 8px; border:1px solid #ddd; color:#7c7c7c; background:#ddd;}
.page a:hover,.page2 a:hover{ background:#ddd;}

/* Flot Chart Containers */

.flot-chart {
    display: block;
    height: 400px;
}

.flot-chart-content {
    width: 100%;
    height: 100%;
}

/* Custom Colored Panels */

.huge {
    font-size: 40px;
}

.panel-green {
    border-color: #0978b8;
 position:absolute;
 top:4em;
 left:18em;
}


.panel-green > .panel-heading , .table-green > th{
    border-color: #0978b8;
    color: #fff;
    background-color: #0978b8;
	
}
.panel-green > .panel-body, .panel-primary > .panel-body{
	padding:0;
	height:400px;
	background-color:#53a5d0;
	overflow:auto;
}
.panel-heading span
{
    margin-top: -23px;
    font-size: 15px;
    margin-right: -8px;
}

.clickable {
    background: rgba(0, 0, 0, 0.15);
    display: inline-block;
    padding: 4px 8px;
    border-radius: 4px;
    cursor: pointer;
}
.panel-green > a {
    color: #5cb85c;
}

.panel-green > a:hover {
    color: #3d8b3d;
}

.panel-red {
    border-color: #d9534f;
}

.panel-red > .panel-heading {
    border-color: #d9534f;
    color: #fff;
    background-color: #d9534f;
}

.panel-red > a {
    color: #d9534f;
}

.panel-red > a:hover {
    color: #b52b27;
}

.panel-yellow {
    border-color: #f0ad4e;
}

.panel-yellow > .panel-heading {
    border-color: #f0ad4e;
    color: #fff;
    background-color: #f0ad4e;
}

.panel-yellow > a {
    color: #f0ad4e;
}

.panel-yellow > a:hover {
    color: #df8a13;
}
.refreshicon{ border-radius:20px; padding:3px 8px;}
.btn{padding:5px 10px;    font-size: 18px;}
.dropup >.btn{margin-right:0;}
.dropup{ position:fixed; bottom:4.5em; right:3.5em;}
.dropup > ul > li{display: block; font-size:15px;
    padding: 3px 10px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;}
.dropup > .dropdown-menu{height:400px; overflow:auto;}

/*table樣式*/
.table-info{ text-align:center; border:2px solid #aaceb0;}
.table-info th{text-align:center;}
.table>tbody>tr>td, .table>tfoot>tr>td, .table>thead>tr>td{ padding: 3px;}
.table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>th { padding: 4px 6px;}
.close {
    float: right;
    font-size: 2em;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=50);
    opacity: .5;
}
	
/*路線顏色*/
.r2, .r2 label{ color:#FF7472}
.r5, .r5 label{ color:#E69E6C}
.r7, .r7 label{ color:#A9666F}
.r8, .r8 label{ color:#F3BA4D}
.r9, .r9 label{ color:#A3D762}
.r10, .r10 label{ color:#B29577}
.r11, .r11 label{ color:#A1B1FE}
.r14, .r14 label{ color:#EC57AB}
.r15, .r15 label{ color:#C69A51}
.r17, .r17 label{ color:#56A178}
.r18, .r18 label{ color:#ACACAC}
.r19, .r19 label{ color:#CA94C3}
.r20, .r20 label{ color:#F7B37E}
.r21, .r21 label{ color:#BFC5E2}
.r22, .r22 label{ color:#C5AFD3}
.r23, .r23 label{ color:#CCCD4E}
.r25, .r25 label{ color:#D7B4D4}
.r26, .r26 label{ color:#BB9B6C}
.r27, .r27 label{ color:#FABF7A}
.r28, .r28 label{ color:#ABDFF7}
.r29, .r29 label{ color:#6E8FAA}
.r30, .r30 label{ color:#E9AE86}
.r31, .r31 label{ color:#A4A4A4}
.r32, .r32 label{ color:#96D7D4}
.r33, .r33 label{ color:#6EB1CE}
.r34, .r34 label{ color:#D8C5DB}
.r35, .r35 label{ color:#7FFFFE}
.r36, .r36 label{ color:#D8DA78}
.r37, .r37 label{ color:#D0C653}
.r38, .r38 label{ color:#AFDBB8}
.r39, .r39 label{ color:#9BB3DC}
.r40, .r40 label{ color:#B6B462}
.r48, .r48 label{ color:#C4B8A8}
.r49, .r49 label{ color:#DABB8F}
.r62, .r62 label{ color:#F1949E}

/*路線色塊*/
.rcolor{display:inline-block; width:13px; height:13px; margin-left:5px;}
.rb2{ background-color:#FF7472;}
.rb5{ background-color:#E69E6C}
.rb7{ background-color:#A9666F}
.rb8{ background-color:#F3BA4D}
.rb9{ background-color:#A3D762}
.rb10{ background-color:#B29577}
.rb11{ background-color:#A1B1FE}
.rb14{ background-color:#EC57AB}
.rb15{ background-color:#C69A51}
.rb17{ background-color:#56A178}
.rb18{ background-color:#ACACAC}
.rb19{ background-color:#CA94C3}
.rb20{ background-color:#F7B37E}
.rb21{ background-color:#BFC5E2}
.rb22{ background-color:#C5AFD3}
.rb23{ background-color:#CCCD4E}
.rb25{ background-color:#D7B4D4}
.rb26{ background-color:#BB9B6C}
.rb27{ background-color:#FABF7A}
.rb28{ background-color:#ABDFF7}
.rb29{ background-color:#6E8FAA}
.rb30{ background-color:#E9AE86}
.rb31{ background-color:#A4A4A4}
.rb32{ background-color:#96D7D4}
.rb33{ background-color:#6EB1CE}
.rb34{ background-color:#D8C5DB}
.rb35{ background-color:#7FFFFE}
.rb36{ background-color:#D8DA78}
.rb37{ background-color:#D0C653}
.rb38{ background-color:#AFDBB8}
.rb39{ background-color:#9BB3DC}
.rb40{ background-color:#B6B462}
.rb48{ background-color:#C4B8A8}
.rb49{ background-color:#DABB8F}
.rb62{ background-color:#F1949E}

.suggestmail .control-label{text-align:right;}
@media (min-width: 768px){
	.container {width: auto; }
	.nomobile{display:block;}
}
@media (min-width: 992px){
	.container {width: auto; }
}
@media(min-width:1200px) {
	.container{max-width:1190px;margin:0 auto;}
	ul.navigation li a {font-size: 1.2em;}
	
}
@media(max-width:1200px) {
	ul.navigation li a {
    padding: 0 .5em;
}
}
.modal-header{background-color:#48BBF3;color:#fff;padding:5px;}
.table td.lineleft {
    border-left: 2px solid #8dd36e;
}
.gline {
    border: 2px solid #8dd36e;
}
.redbg {
    color: #fff;
    background-color: #D00A0D!important
}
.greenbg {
    color: #fff;
    background-color: #177621!important
}
.bulebg {
    color: #fff;
    background-color: #1E8DB4!important
}
.ybg {
    color: #fff;
    background-color: #FFBE00!important
}
.form-inline .form-group{margin-bottom:5px;}
.feed_p {margin:15px;}
.feed_p li{margin:5px 0;}
.feed_p p{margin:5px 10px;}
.feed_p .page-title{font-size:20px;margin-top:15px; border-bottom:2px solid #0153c2; color: #0153c2; padding-bottom:5px;}
.panel-news > .panel-heading {
    border-color: #2387a0;
    color: #fff;
    background-color: #2387a0;
}
.panel-news{border-color: #2387a0;}
.panel-news h3{font-size: 20px; color: #0153c2; margin:0 0 5px;padding:5px;border-left:2px solid #0153c2;}
.panel-news h3 span{font-size: 15px;}
#accordion .panel-body{ max-height:450px;overflow: auto;}

/*767px以下樣式*/
@media screen and (max-width: 767px) {
	#googleMaps{height: calc(100% - 50px);}
	body {
       font-size: 15px;
    }
	
	.navbar-inverse .navbar-toggle{border:0; background-color:#fff; width:38px; height:38px; border-radius:25px; padding:5px; margin:6px 15px 0 0;}
	.navbar-inverse .navbar-toggle:focus,.navbar-inverse .navbar-toggle:hover{background-color:#fff}
	.navbar-toggle .icon-bar{width: 28px; height: 28px; background-color:#124455;}
	.navbar-toggle .fa{color:#2296bf;}
	ul.navigation{width:100%; height:50px; position:fixed; bottom:0; right:0; z-index:9999;background: #04a9da;}
	ul.navigation li{height: 100%; border-radius:0; width:20%;  color: #111; text-shadow:none;border-left:1px solid #fff; }
	ul.navigation li a{overflow:hidden; white-space:inherit; text-overflow:ellipsis; text-align:center; line-height: 18px;padding:.4em 0.2em!important;font-size:1em; height: 100%;}
	ul.navigation li:nth-child(2) a, ul.navigation li:nth-child(3) a, ul.navigation li:nth-child(4) a{padding:.4em .3em!important;}
	ul.navigation li:first-child{border-left:0;}
	ul.navigation li a:hover, ul.navigation li.current{background:#044d67;}
	ul.navigation li:last-child{display:none;}
	.logo{display:inline-block; width:144px; background:url(../img/mblogo.png) no-repeat right top;}
	.pernb{ top:5px; left:150px;}
	.navbar-nav {margin: 0 -15px;}
	.navbar-inverse .navbar-collapse{ border:0;box-shadow: 0 1px 2px 3px rgba(0,0,0,.2)}
	.navbar-header{height:50px;}
	.container, .page, .page2{
	padding-bottom:4em;}
	.container{margin:0 auto;}
	.showlist {left:1em;}
	.nomobile{display:none;}
}

.topform{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
}
.topform .form-group {
    margin-bottom: 8px;
}
.topform>div.form-group:nth-of-type(1){-webkit-order: 1; order: 1;}
.topform>div.form-group:nth-of-type(2){-webkit-order: 2; order: 2;}
.topform>div.form-group:nth-of-type(3){-webkit-order: 3; order: 3;}
.topform>div.form-group:nth-of-type(4){-webkit-order: 4; order: 4;}
@media screen and (max-width: 767px) {
	.topform>div.form-group:nth-of-type(1){-webkit-order: 1; order: 1;}
	.topform>div.form-group:nth-of-type(2){-webkit-order: 4; order: 4;}
	.topform>div.form-group:nth-of-type(3){-webkit-order: 3; order: 3;}
	.topform>div.form-group:nth-of-type(4){-webkit-order: 2; order: 2;}
}
.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
    max-height: 400px;
}
/*application*/
.application{max-width:1100px;}
.application .page-header a{color:#FF0004;text-decoration: underline;}
.application .page-header small{color:#FF0004;}
.panel-warning>.panel-heading {
    color: #663500;
    background-color: #ffdd3f;
    border-color: #ffdd3f;
}

/*** 20220208tap ***/

.nav-tabs {
    border-bottom: 1px solid #006bc1;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #495057;
    background-color: #fff;
    border-color: #006bc1 #006bc1 #fff;
	border-top:5px #006bc1 solid;
	margin-top:-3px;
}
.nav-tabs>li>a {
    margin-right: 2px;
    line-height: 1.42857143;
    border: 0 solid transparent;
    border-radius: 6px 6px 0 0;
	background-color:#dbe8ec;
	color:#111;
	padding: 6px 15px;
}
.nav-tabs>li>a:hover {
	background-color:#93bfcc;
	color:#fff;
}

.truckbtn{
	margin:5px 5px 0 5px;
	border-bottom: 1px solid #006bc1;
}
.truckbtn a.active {
    color: #495057;
    background-color: #fff;
    border-color: #006bc1 #006bc1 #fff;
	border-top:5px #006bc1 solid;
	border-left:1px #006bc1 solid;
	border-right:1px #006bc1 solid;
	border-bottom:1px #fff solid;
	margin-top:-3px;
	margin-bottom:-1px;
}
.truckbtn a{
    line-height: 1.42857143;
    border-radius: 6px 6px 0 0;
	background-color:#dbe8ec;
	color:#111;
	padding: 6px 15px;
	display: inline-block;
	text-decoration: none;
}
.truckbtn a:hover {
	background-color:#dbf1f8;
	color:#006bc1
}
.tab_css{display:flex;flex-wrap:wrap;margin:10px 0 0 10px;}
.tab_css input{display:none}
.tab_css label{
	color: #495057;
	line-height: 1.42857143;
    border-radius: 6px 6px 0 0;
	padding: 3px 10px;
	margin-right:2px;
    background-color: #e6f2f6;
	border-bottom: 1px solid #006bc1;
	margin-top:-3px;
	margin-bottom:-1px;
	z-index: 1;
}
.tab_content{order:1;display: none; width:100%; line-height: 1.6; border-top: 1px solid #006bc1;}
.tab_css input:checked + label, .tab_css label:hover{
	opacity: 1; 
	font-weight:bold;
	cursor: pointer;
	border-top:5px #006bc1 solid;
	background-color:#fff;
	border-left:1px #006bc1 solid;
	border-right:1px #006bc1 solid;
	border-bottom:1px #fff solid;
	color:#006bc1;
}
.tab_css input:checked + label + .tab_content{display: initial;}
.tab_css .carinform{
	padding:5px 0;
}
.tab_css .carinform .row .col-xs-6{margin:0!important;padding:0 1px!important;}
.carinform{padding:10px; background-color:#fff;font-size:15px;}
.carinform ul{list-style: none;padding:0;margin-bottom: .5rem; }
.carinform i{width:25px; text-align: center;}
.carinform hr{margin-top: .5rem; margin-bottom: .5rem;}
.carinform img{vertical-align: bottom;}
.carinform p{margin-bottom: .2rem;}
.carinform .p-1{padding: .1rem!important;}
.carinform .btn{padding: .1rem .6rem;font-size: 15px;}
.carinform .col-xs-6{min-width: 6rem;}
.carinform .btn i{width:auto;}
.btn-circle {
    height: 30px;
    width: 30px;
    padding: 0.1rem 0.25rem;
    border-radius: 50%;
}
.card-deck {
    margin-right: -.2rem;
    margin-left: -.2rem;
}
.card-deck .card{margin-right: .2rem; margin-left: .2rem; border: .05rem solid rgba(0,0,0,.1);margin-bottom: 0;}
.timebox{margin:.2rem 0; padding:.05rem .3rem;  border-radius: .5rem;min-height: 60px;}
.timebox:first-child{margin-right:0;}
.timebox .huge{display: block; font-size: 18px;}
.text_prompt{display: block;}
.text-danger{color:#dc3545!important;}
.border-danger{
	border-color:#dc3545!important;
	border-radius: 5px;
}

.no-gutters {
    margin-right: 0;
    margin-left: 0;
}
.mb-3, .my-3 {
    margin-bottom: 1rem!important;
}
.mb-1 {
    margin-bottom: 0.4rem!important;
}
.no-gutters div{
	padding:0 2px!important;
}

.btn-outline-primary{color:#337ab7;border-color:#337ab7}.btn-outline-primary:hover{color:#fff;background-color:#337ab7;border-color:#337ab7}.btn-outline-primary.focus,.btn-outline-primary:focus{box-shadow:0 0 0 .2rem rgba(0,123,255,.5)}.btn-outline-primary.disabled,.btn-outline-primary:disabled{color:#337ab7;background-color:transparent}
.btn-sm{
	font-size: 15px;padding: .1rem 1rem!important;
}
.btn-round{
	border-radius: 20px;
}