/* HTML window.history.back();return false;*/
body{
	overflow-x:hidden;
	overflow-y:auto;
	font-family:微軟正黑體, Arial, Helvetica, sans-serif;
	font-weight:100;
/*	font-family:Helvetica, Arial, sans-serif;letter-spacing:.2em;*/

}
/*header*/
#kmblogo{
		width:110px;
		background-image:url("../assets/KMB_logo.png");
		background-repeat:no-repeat;
		background-size:contain;
		margin-top:20px;
		margin-left:20px;
		margin-right:20px;
		padding:5px 0px;
	}
	#lwblogo{
		width:110px;
		background-image:url("../assets/LWB_logo.png");
		background-repeat:no-repeat;
		background-size:contain;
		margin-top:20px;
		margin-right:20px;
		padding:5px 0px;
	}
.clearfix {
    /*overflow: auto;*/
}

.kmbv2-navbar ul{
	list-style:none;
}
.kmbv2-navbar li a {
    display: block;
    font-size:20px;
  
    text-align: center;
   color: #000; margin-top:0px;
    padding: 10px 10px;
    line-height:20px;
	transition: 0.3s ease;
	
}

.kmbv2-navbar li a:hover{
  border-bottom: 4px solid #009688;
  	padding: 10px 10px;
	background-color:#fff;
/*padding: 6px 0; 	color:#fff;
	letter-spacing:.3em;
	background-color:rgba(219, 219, 238, 0.20);
	border-radius:15px;
	background-color:rgba(219, 219, 238, 0.20);
	background-color: rgba(0, 0, 0, 0.4);
background: rgba(0, 0, 0, 0.4);*/

}

.rightnav{
	float:right;
	
}
.rightnav a{
	float:right;
	color:#95989A;
	font-size:14px;
	text-align:center;
}

.rightnav li a:hover{
	color:#5C5C5C;
	background-color:#fff;
	/*letter-spacing:.3em;*/

	
}
.active{
	color:#5C5C5C;
}
.rightnav .active{
	color:#5C5C5C;
}

.news_more{
  

    font-size: 18px;
    font-weight: 800;	
}



@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    .rightnav{
	    display:none;
    }
   
}
/*Slideshow*/
.mySlides {display:none}
.w3-left, .w3-right, .w3-badge {cursor:pointer}
.w3-badge {height:13px;width:13px;padding:0;margin-right:5px;}

/*Content- News Section*/
	.newsbox{
		height:auto;
		max-height:419px;
		height:auto !important;        /* for IE as it does not support min-height */
		padding-bottom:20px;
		overflow:scroll;
	}
	.news{
		background-color:#fff;
		width:49%;
		float:left;
		overflow:auto;
		
	}

		.news_more{
		/*position: relative !important;*/
	}
	.newstitle {
		text-align:center;
		font-size:22px;
		font-weight:600;
		letter-spacing:.1em;
	
		/*text-shadow:0px 2px 6px #444;*/
		line-height:54px !important;
		/*background-color:#7E8D1D;
		background-color:#208D3F;*/
		height:54px;
		position:relative;
		

    color: #009688;

 
    border-top: 3px solid #009688;
    border-bottom: 1px solid #ccc;
		
	}
	
	.qrcode img{
		width:98px;
	}
	.qrcode{
		    height: 110px;
	}	
/*	.newstitle:before,
	.newstitle:after {
		position:absolute;
	    top: 100%;
	    left: 50%;
	    margin-left: -10px;
	    content: '';
	    width: 0;
	    height: 0;

	    /*border-top: solid 10px #7E8D1D;*/
	    border-top: solid 10px #208D3F;
	    border-left: solid 10px transparent;
	    border-right: solid 10px transparent;
	}*/
	/*.newstitle a{
		position:relative;
		left:20px;
		text-align:center;
		text-decoration:none;
		font-size:22px;
		color:#fff;
		letter-spacing:1em;
		line-height:60px !important;
	}
	.newstitle a:hover{
		z-index:1;
		text-decoration:none;
	}*/
	
	.scrollcon {
		margin-top:15px;
		width:100%;
		height:300px;
		overflow:hidden;
		position:relative;
	}
	.scrolldet {
		position:relative;
		width: 100%;
	}
	.scrollbar {
		background:#F5F5F5;
		width:8px;
		height:400px;
		position:absolute;
		top:65px;
	    right: 6px;
		z-index:8;
		-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
		opacity:0;
	}
	.scrollbar:hover{
		opacity:.3;
	}
	
	.scrollbar span {
		position:absolute;
		background:#b4b7bd;
		width:8px;
		height:50px;
		line-height:29px;
		overflow:hidden;
		left:0px;
		top:0;
		display:block;
		cursor:pointer;
		border-radius: 10px;
		-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	}	
	.scrolldet ul li{
		padding:10px;
		min-height:65px;
	}
	.scrolldet ul li span{
		font-size:14px;
		line-height:24px;
		margin-bottom:5px;
		height:auto;
		float:right;
		right:5px;
	}
	.newstg{
		font-size:16px;
		font-weight:400;
		color:#5C5C5C;
		letter-spacing:.1em;
		overflow:auto;
	/*	max-height:400px;*/
		height:400px;
	}
	.newstg tr:nth-child(even){
		background:#eee;
		min-height:70px;
		height:auto;
	}
	.newtg tr{
		padding:20px;
	}
	
	
	
		/* Article Section - Features Button */

		#smartphoneappbtn{
		height:58px;
		background-image:url("../assets/downloadappbtn.svg");
		background-repeat:no-repeat;
		background-size:contain;
		background-position:center center;
		margin:0em;		
	}
	.mobileappbtn{
		margin:auto;
		margin-top:6px;
		width:90%;
		padding:3px 0px;
		position:relative;
		top:0;
	}	
	#routesearchbtn{
		height:75px;
		background-image:url("../assets/routesearchbtn.png");
		background-repeat:no-repeat;
		background-size:contain;
		background-position:center center;	
	}
	/* Article Section - Features Buttons */	

	.text{
		font-size:16px;
		text-align:center;
		color:#fff;
	}

	/*.buttontg{
		padding:5px;
		margin:0;
		font-size:16px;
		font-weight:200;
		color:#fff;
		letter-spacing:.1em;
		height:78px;
	}
	.buttontg td{
		padding:0;
		margin:0;
	}*/

	
	/* Section - Features Box */	
	

	
	
	.featuretitle{
		text-align:center;
		font-size:16px;
		font-weight:800;
		letter-spacing:.05em;
		color:#fff;
		text-shadow:0px 2px 6px #444;
		line-height:54px !important;
		/*background-color:#98A820;*/
		background-color:#208D3F;
		height:54px;
		position:relative;
	}
	.featuretitle:before,
	.featuretitle:after {
		z-index: 0;
		position: absolute;
	    top: 100%;
	    left: 50%;
	    margin-left: -10px;
	    content: '';
	    width: 0;
	    height: 0;
	    border-top: solid 10px #208D3F;
	    border-left: solid 10px transparent;
	    border-right: solid 10px transparent;
	}
	
	.featurephoto1{
		width:100%;
		margin:auto;
		height:138px;
		margin-bottom:10px;
		background-color:#f9f9f9;
	}
	.featurephoto1 img{
		display: block;
		margin-left: auto;
		margin-right: auto;
		padding:25px;
	}
	.featurephoto2{
		width:100%;
		margin:auto;
		height:138px;
		margin-bottom:10px;
		background-image:url("../assets/open-top-bus.jpg");
		background-size:cover;
		background-repeat:no-repeat;
	}
	
	.featurecontent{
		padding:0px 12px;
		font-size:18px;
		font-weight:600;
		letter-spacing:.05em;
		line-height:24px;
		color:#5C5C5C;
		text-align:left;
	
	}
	.featurecontent h4{
		font-size:15px;
		font-weight:800;
		line-height:16px;
		color:#5C5C5C;
		letter-spacing:.02em;
	}
	.featurecontent p{
		/*font-size:15px;
		font-weight:200;*/
		font-weight:400;
		color:#515151;
		line-height:20px;
		margin:0em;
	}
	.featurecontent span{
		visibility:hidden;
	}
	.featurebox{
	/*	min-height:480px;
		height:auto !important;         for IE as it does not support min-height */
		height:100%;
		padding-bottom:20px;
		margin-bottom:20px;

		
	}


	.featurebtn{
		width:130px;
		height:40px;
		margin:auto;
		background-color:#16B29B;
		text-align:center;
		margin-top:30px;
		
	}
	.featurebtn a{
		text-decoration:none;
		color:#fff;
		font-size:16px;
		font-weight:400;
		letter-spacing:.1em;
		line-height:40px;
	}
	.featurebtn:hover{
		box-shadow:0px 5px 15px lightgrey;
	}
	

	/*Google Ad 
	#googlead{
		width:100%;
		height:75px;
		background-image:url(../assets/googlead.png);
		background-repeat:no-repeat;
		background-position:top center;
		background-size:contain;
		padding:20px;
		background-color:#f9f9f9;
		height:120px;
	}*/

/*Web Guides Table */
	.tableheader3{
	
		font-size:20px;
		font-weight:400;
		letter-spacing:.2em;
		color:#68b8c4;
	}
	
	.links a{

		text-decoration:none;
		color:#ccc;
		font-size:16px;
		font-weight:300;
		letter-spacing:.2em;
	
	}
	.links a:hover{
		text-decoration:none;
		color:#fff;
		font-size:16px;
		font-weight:300;
		letter-spacing:.3em;
		text-shadow:1px 1px 2px #444;
	}

/* Footer Section - Social Media */	
	div#panel {
	    padding-top: 30px;
	    background-color:#444;
	    max-height: 0;
	    overflow: hidden;
	    transition: 0.6s ease-in-out;
	    opacity: 0;
	}

	#c1{
		background-image:url("../assets/facebookbtn.svg");
		background-repeat:no-repeat;
		background-size:contain;
		background-position:right center;
		height:40px;
		width:33%;
		margin-bottom:16px;
	}
	#c2{
		background-image:url("../assets/youtubebtn.svg");
		background-repeat:no-repeat;
		background-size:contain;
		background-position:center center;
		height:40px;
		width:33%;
		
	}
	#c3{
		background-image:url("../assets/instagrambtn.svg");
		background-repeat:no-repeat;
		background-size:contain;
		background-position:left center;
		height:40px;
		width:33%;
		margin-bottom:16px;
	}
	.socialmedia img{
		display:inline-block;
		width:40px;
		margin-right:10px;
	}




	
	
/* Section: Accordion Button*/
/* Style the buttons that are used to open and close the accordion panel */
button.accordion {
    height:80px;
    width: 100%;
    background-color: #F9F9F9;
    color: #444;
    text-align: center;
	font-size: 24px;
	font-weight:200;

	letter-spacing: .2em;
	line-height: 3em;
    
    cursor: pointer;
    border: none;
    border-top:.05em solid #eee;
    outline: none;
    transition: 0.4s;
}


div#panel {
    padding: 50px 18px;
    background-color:#444;
    max-height: 0;
    overflow: hidden;
    transition: 0.6s ease-in-out;
    opacity: 0;
}

div#panel.show {
    opacity: 1;
    max-height: 1500px;
	    background-color:rgb(0, 150, 136);
	    margin-bottom:10px;	
}
.accordion { 	
	position:relative;
	background-color:#F9F9F9;
	height:80px !important;
	width:100% !important;
	text-align: center;
	font-size: 24px;
	font-weight:100;
	color:#5C5C5C;
	letter-spacing: .2em;
	border-top:.05em solid #eee;
	
}

.accordion:after {
	z-index: 1;
	position: absolute;
    top: 100%;
    left:50%;
    margin-left:-25px;
    content: '';
    width: 0;
    height: 0;
    border-top: solid 14px #F9F9F9;
    border-left: solid 14px transparent;
    border-right: solid 14px transparent;
    padding:0;
}

/*Web Guides Table */

	.webguidelinks{
		width:80%;
		margin:auto;
		height:auto;
	}
	.tableheader3{
	
		font-size:20px;
		font-weight:400;
		letter-spacing:.2em;
		color:#FFF;
	}
	
	.links a{

		text-decoration:none;
		color:#fff;
		font-size:16px;
		font-weight:300;
		letter-spacing:.2em;
	
	}
	.links a:hover{
		text-decoration:none;
		color:#fff;
		font-size:16px;
		font-weight:300;
		letter-spacing:.2em;
		text-shadow:1px 1px 2px #444;
	}
.terms{
	font-size: 14px; 
	font-weight:200; 
	text-align:center;
	vertical-align:top;
	padding:20px;
	letter-spacing:.2em;
	color:#95989A;
}

.terms a:hover{
	font-size: 14px; 
	font-weight:200; 
	text-align:center;
	vertical-align:top;
	padding:20px;
	letter-spacing:.2em;
	color:#444;
}
.copyright{
	font-size: 12px; 
	font-weight:200; 
	text-align:center;
	vertical-align:top;
	padding:20px;
	letter-spacing:.1em;
	color:#95989A;
}
/* =============================================================================
  BOX SIZING & CLEARFIX
============================================================================= */
.section__content {
  		width:100%;
		margin:auto;
		height:200px;
		margin-bottom:10px;
		background-color:#f9f9f9;
	}

*,
*::before,
*::after {
  -moz-box-sizing: border-box;
       box-sizing: border-box;
}

.clearfix::after {
  content: "";
  display: table;
  clear: both;
}


.card {
  position: relative;
  float: left;
  padding-bottom: 25%;
  width: 100%;
  text-align: center;
}

/* card fronts and backs */
.card__front1, .card__front2, .card__front3
.card__back1, .card__back2, .card__back3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  
}

.card__front1, .card__front2, .card__front3,
.card__back1, .card__back2, .card__back3 {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transition: -webkit-transform 0.3s;
          transition: transform 0.3s;
}

.card__front1 {
   background-image:url("../assets/interchangephoto1.jpg");
		background-size:cover;
		background-repeat:no-repeat;
		background-position:center center;
		width:100%;
		margin:auto;
		height:200px;		
		margin-bottom:10px;
		background-color:#f9f9f9;
	}

/*
.card__back1 {
  background-image:url("../assets/ETA_search.jpg");
		background-size:cover;
		background-repeat:no-repeat;
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
          width:100%;
		margin:auto;
		height:200px;
		margin-bottom:10px;
		background-color:#f9f9f9;
}*/

.card__front2 {
  background-image:url("../assets/ETA_search.jpg");
		background-size:cover;
		background-repeat:no-repeat;
		background-position:center center;
		width:100%;
		margin:auto;
		height:200px;
		margin-bottom:10px;
		background-color:#f9f9f9;
	}
	
/*.card__front2 {
  background-image:url("../assets/fare2021.jpg");
		background-size:cover;
		background-repeat:no-repeat;
		background-position:center center;
		width:100%;
		margin:auto;
		height:200px;
		margin-bottom:10px;
		background-color:#f9f9f9;
	}
.card__back2 {
  background-image:url("../assets/open-top-bus_back.jpg");
		background-size:cover;
		background-repeat:no-repeat;
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
          width:100%;
		background-position:center center;
		margin:auto;
		height:200px;
		margin-bottom:10px;
		background-color:#f9f9f9;
}*/
.card__front3 {
  background-image:url("../assets/LiveChat_cht-1.jpg");
		background-size:cover;
		background-repeat:no-repeat;
		background-position:center center;
		width:100%;
		height:200px;
		margin:auto;
		background-color:#f9f9f9;
}

/*
.card__back3 {
  background-image:url("../assets/LiveChat_cht-2.jpg");
		background-size:cover;
		background-repeat:no-repeat;
		background-position:center center;
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
          width:100%;
          height:200px;
		margin:auto;
		height:200px;
		margin-bottom:10px;
		background-color:#f9f9f9;
}

*/
/* hover effect 
.card.effect__hover1:hover .card__front1 {
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}

.card.effect__hover1:hover .card__back1 {
  -webkit-transform: rotateY(0);
          transform: rotateY(0);
}
.card.effect__hover1:hover .card__front2 {
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}

.card.effect__hover1:hover .card__back2 {
  -webkit-transform: rotateY(0);
          transform: rotateY(0);
}
.card.effect__hover1:hover .card__front3 {
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}

.card.effect__hover1:hover .card__back3 {
  -webkit-transform: rotateY(0);
          transform: rotateY(0);
}*/


/*Header*/
	 #main-header{width: 100%;  background:#fff;}

body{
	height:auto;
}
#main-header .kmbv2-hide-small{padding-top:8px;padding-left:15px;}
#main-header.fixed-header {top:0px; left: 0; right: 0; z-index:9999; position: fixed; box-shadow: 0 0 7px rgba(0, 0, 0, 0.1) !important; -moz-box-shadow: 0 0 7px rgba(0, 0, 0, 0.1) !important; -webkit-box-shadow: 0 0 7px rgba(0, 0, 0, 0.1) !important; }
.animated-content#page-container {     padding-top: 50px;transition: margin-top, 0.4s ease-in-out; -webkit-transition: margin-top, 0.4s ease-in-out; -moz-transition: margin-top, 0.4s ease-in-out; }
/*#main-header .separator:after{ position: absolute; content: '|';  right: 0; top: 10px;  margin: -10px;  padding: 10px;  color: #222;	}*/




/*media queries*/
/* For iPad (1024 x 768) - Landscape  */
/* For Small Desktop (1280 x 1024) - Portrait ( */
/* For Normal Browser (1024 x 960) - Landscape) */
@media only screen and (max-width: 1024px) {
	
	/*Header - Navigation bar*/
	.wrap img{
		width:90px;
	}
	#lwblogo{
		height:24px;
	}
	li.wrap {
	    width: 230px;
	    height: 50px;
	    position: relative;
	}
		li.wrap a:nth-of-type(1) {
	    left: 0;
	}
	
	li.wrap a:nth-of-type(2) {
	    right: 0;
	}

	li a {
		font-size:18px;
	}
		.qrcode{
		    height: 160px;
	}
			.qrcode img{
		    width: 120px;
	}
	/*Feature Section
	.newstg{
		height:370px;
	}*/
	.news-cms{
		height:380px;
	}
	.newsbox{
		min-height:440px;
		height:auto;
	}
	.newstg td{
		padding:8px 10px;
	}
	.featurecontent{
		font-size:1.1em;
		font-weight:600;
	}
	
	#mySidenav{
		display:none;
	}
	
}


/* For iPhone 4 (640 x 960) - Landscape */
/* For Normal Browser (960 x 1024) - Portrait */

@media only screen and (max-width: 960px) {
	#page1{
		display:none;
	}
	.newstg td{
		padding:8px 10px;
	}
	.featurecontent{
		font-size:1em;
	}
	.newsbox{
		min-height:440px;
		
	}
	
	.webguidelinks{
		width:90%;
		padding-bottom:40px;
	}
	/*.card__front1 {
  		background-image:url("../assets/ETA_Card_chi2.svg");
		background-size:contain;
		background-color:;
	}*/
	.featurebox{
    position: relative;
    display: inline-block;
    padding-bottom: 50px;
	}
}



/* For Small Tablet (800 x 600) -  Landscape */

@media only screen and (max-width: 800px) {

	.news_more{
		position: relative;
	}
	.newsbox{
		min-height: 485px;
		    
	}
	.news-cms{
		min-height:428px;
	}
	.newstitle{
		font-size:18px;
	}

	.featuretitle1, .featuretitle2, .featuretitle3{
		font-size:18px;
	}
}



/* For iPad Portrait */

@media only screen and (max-width: 768px) {
	
	
	/*Header - Navigation bar*/
	.language{
		display:none;
	}
	/*.rightnav{
	    display:none;
    }
	.wrap img{
		width:90px;
	}
	#lwblogo{
		height:24px;
	}
	li.wrap {
	    width: 230px;
	    height: 46px;
	    position: relative;
	}
		li.wrap a:nth-of-type(1) {
	    left: 0;
	}
	
	li.wrap a:nth-of-type(2) {
	    right: 0;
	}
	li a {
		font-size:18px;
	}
	/* Feature Section */

		.news_more{
		position: absolute !important;
	}
	.newstg{
		min-height:410px;
		height:auto;
	}
	.newsbox{
		min-height:480px;
	}
	.newstitle{
		font-size:16px;
	}
	.news-cms{
		min-height:420px;
	}
	
	.featuretitle1, .featuretitle2, .featuretitle3{
		font-size:16px;
	}
	.featurecontent{
		font-size:1.1em;
		font-weight:600;
	}
	#mySidenav{
		display:none;
	}
	.featurebox{
/*		min-height:450px;*/
	}
}


/* For iPhone 4 (640 x 960) -  Portrait */

@media only screen and (max-width: 640px) {
	
	#sidemenu{
		display:block;
		
	}

	
	.webguidelinks{
		width:100%;
		padding-bottom:40px;
	}
	/* Feature Section */
	
	
	.newsbox{
		min-height:480px;
	}
	.newstg{
		/*max-height:400px;*/
		height:auto;
		font-size:16px;
	}

	.featurebtn{
		width:90%;
	}
	.newstitle{
		font-size:16px;
	}
	.featuretitle1, .featuretitle2, .featuretitle3{
		font-size:16px;
	}
	
	.tableheader3{
		font-size:16px;
	}
	.links a{
		font-size:14px;
	}
	
}

/* For Small Tablet (800 x 600) -  Portrait */

@media only screen and (max-width: 600px) {
	.news-cms{
		height:460px;
	}
	.newsbox{
		width:94.5%;
		min-height:480px;
		margin-bottom:10px;
	}
	.newstitle{
		font-size:20px;
	}
	.newstg{
	/*	max-height:400px;*/
		height:auto;
		font-size:16px;
	}
	.featuretitle1, .featuretitle2, .featuretitle3{
		font-size:16px;
	}
	.tableheader3{
		font-size:22px;
	}
	.links a{
		font-size:18px;
	}
	.newslist li{
		font-size:20px;
	}
	/*.card__front1 {
  		background-image:url("../assets/ETA_Card_chi.svg");
		background-size:contain;
		background-color:;
	}*/
}



/* For smallscreen smartphone Portrait */

@media only screen and (max-width: 480px) {
	
	#mainnav{
		z-index:1000;
	}
	#wrapper{
		top:100px;
	}
	#mySidenav a{
		font-size:20px;
		padding:20px;
		margin:0em;
		border-bottom:1px solid #ccc;
	}
	#mySidenav li a:first-child{
		font-size:20px;
		padding:18px;
		margin:0em;
		border-bottom:none;
	}
	.newsbox{
		width:92%;
		margin-bottom:10px;
	}
	.newstg{
		/*max-height:400px;*/
		height:auto
	}
	.featurecontent h4{
		font-size:20px;
	}
	#googlead{
		height:75px;
	}
	.scrollbar{
		visibility:hidden;
	}
	.scrolldet ul li{
		padding-right:0px;
	}
	#col-1reset {
		/*max-height:400px;*/
	}
/*	#col-1reset .featurebox{
		min-height:480px;
	}
	#col-2reset .featurebox{
		min-height:480px;
	}	
	#col-3reset .featurebox{
		min-height:480px;
	}	*/
			
}
/* For iPhone 3 (320 x 480) - Portrait */

@media only screen and (max-width: 320px) {
	.wrap img{
		width:50px;
	}
	#lwblogo{
		height:16px;
	}
	li.wrap {
	    width: 210px;
	    height: 28px;
	    position: relative;
	}
	.featurecontent h4{
		font-size:20px;
	}

}

.kmbv2-table tr,.kmbv2-table th{
	background-color:transparent !important;
	}

	

