@charset "utf-8";
/* CSS Document */

/* Home Content 2015 edit Mic*/

#MainFooter {
	background: #D3D0CB;
	width: 100%;
	height: auto;
	min-height: 300px;
	
	padding: 50px 15px 25px 30px;
	clear: both;
	display: inline-block;
	font-size: 1em;
}
#MainFooter a { color: #333; }

#owl-demo .item{
    background: #42bdc2;
    padding: 30px 0px;
    margin: 5px;
    color: #FFF;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-align: center;
}
#MainFooter h4 { text-align: left; color: #2C3235; border-left:  #2C3235 4px solid; padding-left: 6px;  }
#MainFooter ul { margin: 0 0 25px 0; }
#MainFooter ul li { text-align: left; margin-bottom: 2px; padding-bottom: 2px; }
#MainFooter ul li a:hover { color: #C30; }
#MainFooter .MenuBox { width: 16%; margin: 5px; float: left; }
#MainFooter .large { width: 30%; }
#MainFooter .large img { width: 70%; }

#MainFooter .large .SocialMedia { width: 400px; margin: auto; padding-top: 25px;  }
#MainFooter .large .SocialMedia .circle { 
	width: 60px; 
	height: 60px; 
	text-align: center; 
	line-height: 60px; 
	border-radius: 99em; 
	background:none; 
	border:solid 2px rgba(96,90,85,0.5); 
	margin: 5px 10px; 
	padding-top: 13px;
	float: left; 
	color: rgba(96,90,85,0.5);
	font-size: 2.5em;
	transition: .15s linear;
}
#MainFooter .large .SocialMedia .circle:hover { color: #FFF }
#MainFooter .large .SocialMedia .FB {}
#MainFooter .large .SocialMedia .FB:hover { background: #2A5093; border: #2A5093; transition: .30s linear;  }
#MainFooter .large .SocialMedia .Youtube { font-size: 2.05em; line-height: 57px;  }
#MainFooter .large .SocialMedia .Youtube:hover { background: #BA2A0D; border: #BA2A0D; transition: .30s linear; }
#MainFooter .large .SocialMedia .Location { font-size: 2.15em; }
#MainFooter .large .SocialMedia .Location:hover { background: #D6791D; border: #D6791D; transition: .30s linear; }
#MainFooter .large .SocialMedia .Contact { font-size: 2.15em; line-height: 55px; }
#MainFooter .large .SocialMedia .Contact:hover { background: #2E996D; border: #2E996D; transition: .30s linear; }
#MainFooter .large .SocialMedia .Line { font-size: 2.15em; line-height: 50px; }
#MainFooter .large .SocialMedia .Line:hover { background: #29e126; border: #29e126; transition: .30s linear; }
#MainFooter .Copyright { padding: 15px 0 0 20px;  }
#MainFooter a.webregulation { color: #C30; }

	@media (min-width: 1201px) {
		#MainFooter {
			padding: 25px 0px;
			display: block;

		}
		#MainFooter .MenuBox { width: 24%; margin: 5px 0;  }
		#MainFooter .large { width: 480px; float: none; margin: auto; clear: both; text-align: center; }
		#MainFooter .large img { width: 100%; }
		#MainFooter .large .SocialMedia { width: 400px; margin: 0 0 0 28px ;   }
	}

	@media (max-width: 1200px) {
		#MainFooter {
			padding: 25px 0px;
			display: block;

		}
		#MainFooter .MenuBox { width: 24%; margin: 5px 0;  }
		#MainFooter .large { width: 400px; float: none; margin: auto; clear: both; text-align: center; }
		#MainFooter .large img { width: 100%; }
		#MainFooter .large .SocialMedia { width: 320px; margin: 0 0 0 28px ;   }
	}

	@media (max-width: 800px) {
		#MainFooter {
			padding: 25px 0px;
			display: block;

		}
		#MainFooter .MenuBox { width: 48%; margin: 5px 0;  }
		#MainFooter .large { width: 400px; float: none; margin: auto; clear: both; text-align: center; }
		#MainFooter .large img { width: 100%; }
		#MainFooter .large .SocialMedia { width: 320px; margin: 0 0 0 28px ;   }
	}


	@media (max-width: 480px) {
		#MainFooter {
			padding: 25px 0px;
			display: block;

		}
		#MainFooter .MenuBox { width: 48%; margin: 5px 0;  }
		#MainFooter .large { width: 100%; float: none; clear: both; text-align: center; }
		#MainFooter .large img { width: 80%; }
		#MainFooter .large .SocialMedia { width: auto; margin: 0 0 0 28px ;   }
		#MainFooter .Copyright { padding: 15px 0 0 20px; font-size: 0.85em; }
	}





/* ID Modal Setting */

#MainFooter .modal-content {
  position: relative;
  background-color: #EFEFED;
  border: 1px solid #999999;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  outline: none;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
          box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  background-clip: padding-box;
  min-height: 650px;
}



#MainFooter .modal-header {
  min-height: 16.428571429px;
  padding: 15px;
  border-bottom: 0px solid #e5e5e5;
}

#MainFooter .modal-header .modal-title { font-size: 2em; text-align: center; font-weight: 600; }


#MainFooter .modal-content #ContactInfo {clear: both; padding: 20px 0 0 0;}

#MainFooter .modal-content #ContactInfo .nav-tabs > li > a:hover { background: #888; border: solid 2px #888 ;  color: #FFF; }
#MainFooter .modal-content #ContactInfo .nav-tabs > li.active > a,
#MainFooter .modal-content #ContactInfo .nav-tabs > li.active > a:hover,
#MainFooter .modal-content #ContactInfo .nav-tabs > li.active > a:focus {
	background:#C30; border: solid 2px #C30 ; border-radius: 4px; color: #FFF;
}
#MainFooter .modal-content #ContactInfo .tabpanel {  }

#MainFooter .modal-content h2 { text-align: center; clear: both; font-size: 1.35em; color: rgba(96,90,85,0.7); padding: 0px 0 10px 0px; border-radius: 4px; }
#MainFooter .modal-content h4 { margin: 20px 0; }
#MainFooter .modal-content .Info { clear: both; min-height: 60px; }
#MainFooter .modal-content .Content { width: 100%; }
#MainFooter .modal-content .Content div { color: rgba(96,90,85,0.7); }
#MainFooter .modal-content .Content div.Phone , #MainFooter .modal-content .Content div.FAX { font-size: 1.45em; border: rgba(96,90,85,0.5) solid 2px; padding: 12px 0; border-radius: 8px;  margin: 12px 30px; }
#MainFooter .modal-content .Content div.ADD { font-size: 16px; padding: 10px 0 0 0; }
#MainFooter .modal-content .Content div.More { width: 100px; margin: auto; margin-top: 20px; background: rgba(96,90,85,0.5); color: #FFF; padding: 8px 0; border-radius: 4px;  }
#MainFooter .modal-content .Content div.More:hover { background: #C30; transition: .30s linear; }
#MainFooter .modal-content .LocationTAB { width: 60px; height: 60px; line-height: 60px; font-size: 2.7em; border: rgba(96,90,85,0.5) solid 0px; background: rgba(96,90,85,0.5);  color: #FFF; border-radius: 99em; margin: auto; }
#TPE, #HC, #TC, #KS { width: 48%; min-height: 100px; float: left;  margin: 5px; }
#TC, #KS { margin: 35px 5px 5px 5px; }

#MainFooter .modal-content .btn-default { background: #2C3235; color: #FFF; font-size: 1.5em; margin: 20px 0 20px 0; }




span.MRTSongShanLine { background: #0B7739; color: #FFF; padding: 5px 7px; line-height: 36px; }
span.MRTWenHuLine { background: #683A1F; color: #FFF; padding: 5px 7px; line-height: 36px; }
span.BusTAB { background: #1F7CB5; color: #FFF;  padding: 5px 7px; line-height: 36px; }
span.ExitTAB { background: #FFD400; color: #000;  padding: 5px 7px; line-height: 36px; }
	

	@media screen and (min-width: 768px) {
	  #MainFooter .modal-dialog {
	    width: 800px;
	  }
	}

	@media screen and (max-width: 750px) {
		#TC, #KS { margin: 5px 0px 55px 0px; }
		#TPE, #HC, #TC, #KS { width: 100%; min-height: 100px; float: none;  margin: 5px 0px 55px 0px; }

	}