@charset "UTF-8";

html, body{
	height: 100%;
}

h3, h4, h5, h6, a{
	color: #126748;
}
h3{
	margin: 15px 0 10px 0;
	padding: 5px 0;
	font: 16px Helvetica, Arial, Verdana, sans-serif;
	text-align: left;
	line-height: 150%;
	border-bottom: 1px solid #126748;
	font-weight: bold;
}

p{
	margin-top: 20px;
	font: 14px Helvetica, Arial, Verdana, sans-serif;
	text-align: left;
	line-height: 150%;
}

a{
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}

ol{
	list-style-type: decimal;
	font-size: 14px;
}

body{
	background: #FFF;
	font: 13px Helvetica, Arial, Verdana, sans-serif;
	
	letter-spacing: 1px;
	color: #494949;
}

#header{
	height: 160px;
}

#header ul.list li{
	display: inline-block;
}

#header ul.list li a{
	font-size: 14px;
	font-weight: normal;
	text-decoration: none;
}

form.searchbox{
	display: block;
	background-image: url('../images/search-box.png');
	background-repeat: no-repeat;
	width: 270px;
	height: 26px;
}

form.searchbox input.search{
	width: 210px;
	border: none;
	background: none;
	padding-left: 4px;
	margin-top: 4px;
}

form.searchbox input.search-button{
	margin-left: 10px;
	width: 21px;
	height: 21px;
	background-image: url('../images/search-button.png');
	background-color: transparent;
	background-repeat: no-repeat;
}

form.searchbox input.search-button1{
	margin-left: 10px;
	width: 68px;
	height: 29px;
	background-image: url('../images/search-button1.png');
}

form.searchbox input{
	border: none;
}

#footer{
	margin: 0 auto;
	padding: 19px 0;
	width: 919px;
	font: 13px Helvetica, Arial, Verdana, sans-serif;
	color: #FFF;
}

#footer p{
	margin: 0px;
	font: 12px Helvetica, Arial, Verdana, sans-serif;
	color: #FFF;
	font-style: normal;
}

#wrap{
	height: auto;
	min-height: 100%;
	*display: table; /* For IE7 Hack */
	*height: 100%; /* For IE7 Hack */
	background-image: url('../images/background.jpg');
	background-position: 50% 0%;
	background-repeat: no-repeat;
}

#container{
	width: 919px;
	height: auto;
	margin: 0 auto;
}

#logo{
	width: 169px;
	height: 90px;
	background: url('../images/logo.png');
	margin: 18px 0 0 6px;
	float: left;
}

#body{
	display: block;
}

#title{
	width: 100%;
	height: 39px;
	background: url('../images/title-background.jpg') repeat-x;
}

#title h2{
	width: 215px;
	height: 39px;
	background: #126748;
	color: #FFF;
	line-height: 39px;
	text-align: center;
}

#company-info p{
	margin: 10px;
}

span.readme{
	color: #126748;
	width: 100%;
	text-align: right;
	display: block;
}

span.readme a{
	font-size: 12px;
	font-weight: normal;
}

span.readme a:hover{
	font-style: italic;
}

.right{
	float: right;
}

.left{
	float: left;
}

.clr{
	clear: both;
}

.picture{
	margin:10px 5px 0px;
	display: block;
	padding: 8px;
	background: #FFF;
	border: 1px solid #e7e7e7;
}

.share_icon{
	float: left;
	margin-right: 3px;
}

.D9EFE5-gradient{
	padding: 6px;
	color: #126748;
	background: #d9efe5; /* Old browsers */
	background: -moz-linear-gradient(top,  #d9efe5 0%, #ffffff 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d9efe5), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #d9efe5 0%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #d9efe5 0%,#ffffff 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #d9efe5 0%,#ffffff 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #d9efe5 0%,#ffffff 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d9efe5', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

p.top{
	text-align: right;
	display: block;
	margin: 10px 0;	
}

/****************************************/
/*		選單							*/
/****************************************/

#nav{
	margin-top: 5px;
}

#nav>ul{
	height: 45px;
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: auto;
}

#nav>ul>li{
	float: left;
}

#nav>ul>li>a{
	display: block;
	text-transform: uppercase;
	text-decoration: none;
	float: left;
	height: 25px;
	padding: 10px 20px;
	font: 14px Helvetica, Arial, Verdana, sans-serif;
	font-weight: bold;
}

#nav>ul>li>a.active{
	background: url('../images/nav-chip.jpg') repeat-x;
	color: #FFF;
}

#nav>ul>li>ul{
	list-style-image: url('../images/nav-list-image.png');
	position: absolute;
	/*overflow: visible;*/
	margin-top: 45px;
	background-color: #FFF;
	visibility: hidden;
	z-index: 99;
}

#nav>ul>li>ul>li{
	margin-left: 30px;
	height: 32px;
	line-height: 32px;
	border-bottom: 1px dashed #C9C9C9;
	padding-right: 10px;
}

#nav>ul>li>ul>li>a{
	font: 10px Helvetica, Arial, Verdana, sans-serif;
	color: #666666;
	font-weight: normal;
}

#nav>ul>li>ul>li>a:hover{
	color: #126748;
}

/****************************************/
/*		跑馬燈文字						*/
/****************************************/

#scrolling-text{
	margin: 10px 0 0 0;
	float: left;
}

#scrolling-text span.title{
	float: left;
	font-size: 14px;
	color: #126748;
	font-weight: bold;
}

#scrolling-text a.arrow-left,
#scrolling-text a.arrow-right{
	display: block;
	float: left;
	width: 15px;
	height: 15px;
	margin: 0 2px;
}

#scrolling-text a.arrow-left{
	background-image: url('../images/scroll-text-arrow-left.jpg');
}

#scrolling-text a.arrow-right{
	background-image: url('../images/scroll-text-arrow-right.jpg');
}

#scrolling-text .content{
	float: left;
	width: 500px;
	height: 16px;
	overflow: hidden;
}

#scrolling-text ul{
	position: relative;
	width: 9999px;
}

#scrolling-text ul li{
	float: left;
	width: 500px;
}

#scrolling-text ul a{
	color: #333;
	font-weight: normal;
}
/****************************************/
/*		Banner: ;						*/
/****************************************/

#banner{
	width: 100%;
	height: 393px;
	background: #E8E8E8;
	margin-bottom: 20px;
	padding-top: 7px;
}

#banner a.arrow-left,
#banner a.arrow-right{
	display: block;
	float: left;
	width: 40px;
	height: 45px;
	position: absolute;
	top: 300px;
	z-index: 4;
}

#banner a.arrow-left:active,
#banner a.arrow-right:active{
	top: 301px;
}

#banner a.arrow-left{
	background-image: url('../images/banner-arrow-left.png');
	margin-left: 7px;
}

#banner a.arrow-right{
	background-image: url('../images/banner-arrow-right.png');
	margin-left: 873px;
}

#banner div.slideshow{
	width: 906px;
	height: 310px;
	background: white;
	margin: 0 auto;
	overflow: hidden;
}

#banner div.slideshow ul{
	margin: 0;
	padding: 0;
	list-style: none;
}

#banner div.slideshow li{
	position: absolute;
}

#banner div.slideshow a{
	display: block;
}

#banner div.slideshow a img{
	display: block;
	padding: 0;
	margin: 0 auto;
	border: none;
}

#banner ul.title li{
	position: absolute;
	font-size: 20px;
	font-weight: bold;
	width: 700px;
	overflow: hidden;
	white-space:nowrap;
	background-color: #E8E8E8;
}

#banner ul.text li{
	position: absolute;
	font-size: 14px;
	font-weight: normal;
	width: 700px;
	overflow: hidden;
	white-space:nowrap;
	background-color: #E8E8E8;
}

#banner a.btn{
	display: block;
	float: left;
	border: 2px solid #DFDFDF;
	background: #F2F2F2;
	color: #4F4F4F;
	padding: 3px 5px;
	margin: 0 2px;
}

#banner div.controller a.active{
	background: #FFFFFF;
	color: #126748;
}
/****************************************/
/*		首頁文章						*/
/****************************************/

div.project{
	margin: 15px 0;
}

div.project h4{
	margin-bottom: 10px;
	color: #272822;
}

div.project img{
	margin-right: 15px;
	width: 150px;
	height: 150px;
	padding: 7px;
	background: #FFF;
	border: 1px solid #e7e7e7;
	float: left;
}

div.project p{
	margin: 0;
}

/****************************************/
/*		感興趣						*/
/****************************************/

ul.sense{
	margin-bottom: 20px;
}

ul.sense li{
	display: inline-block;
	margin-right: 7px;
}


/****************************************/
/*		News							*/
/****************************************/

ul.news{
	list-style-type: none;
}

ul.news li{
	background-image: url('../images/new.png'); 
	background-repeat: no-repeat;
	background-position: 6px;
	padding-left: 40px;
}

ul.news li{
	background-color: #FFF;
}

ul.news li:hover{
	background-color: #EBFAEC;
}

ul.news a{
	text-decoration: none;
	color: #6F6F6F;
	padding: 6px 0;
	display: block;
	font-size: 14px;
	font-weight: normal;
}

ul.news span.date{
	font-weight: bold;
	margin-right: 10px;
	color: #126748;
}

/****************************************/
/*		News							*/
/****************************************/
div.news-article{
	margin-top: 25px;
	padding: 10px 0;
	border-top: 3px solid #C3C5C4;
}

div.news-article time{
	padding: 5px;
	color: #126748;
	background-color: #EDEFF0;
	border-radius: 5px;
	font-weight: bold;
}

div.news-article h3{
	color: #126748;
	padding: 5px 0;
	font: 16px Helvetica, Arial, Verdana, sans-serif;
	text-align: left;
	line-height: 150%;
	border-bottom: 3px double #126748;
	font-weight: bold;
}

div.news-article p.community{
	margin-top: 10px;
}

div.news-article div.section{
	margin: 10px 0;
}

div.news-article a.image{
	display: block;
	margin: 0 15px 15px 0;
	padding: 7px;
	background: #FFF;
	border: 1px solid #e7e7e7;
}
div.news-article img{
	max-width: 200px;
	width: auto !important;
	width: 200px;
	max-height: 150px;
	height: auto !important;
	height: 150px;
}

/****************************************/
/*		聯絡我們的table					*/
/****************************************/

table.contacts{
   	border-collapse: separate;
	border-spacing: 20px;
	margin-bottom: 200px;
}

table.contacts th{
	text-align: left;
	width: 142px;
	color: #797979;
	font-weight: normal;
	vertical-align: top;
}

table.contacts td{
	border: 1px solid #DDDDDD;
	width: 350px;
	height: 30px;
	text-align: center;
	vertical-align: middle;
}

table.contacts td.message{
	height: 100px;
}

table.contacts td.command{
	border: none;
	text-align: right;
}

table.contacts span.field{
	font-size: 16px;
	font-weight: bold;
	color: #252525;
}

table.contacts span.star{
	padding-left: 3px;
	font-size: 12px;
	color: #5DB6AC;
}

table.contacts input[type='text']{
	width: 336px;
	height: 28px;
	font-size: 16px;
	background: #F0F0F0;
	color: #555;
	padding: 0 5px;
	border: none;
}

table.contacts textarea{
	width: 336px;
	height: 93px;
	font-size: 16px;
	background: #F0F0F0;
	color: #555;
	padding: 0 5px;
	border: none;
	resize: none;
}

table.contacts input.send-message-button{
	border: none;
	width: 96px;
	height: 24px;
	background-color: transparent;
	background-image: url('../images/send-message-button.jpg');
	background-repeat: none;
	cursor: pointer;
}

/****************************************/
/*		logo: ;							*/
/****************************************/

div.logo-left{
	margin: 10px 0 0 20px;
	float: left;
	display: block;
}

div.logo-right{
	margin: 10px 20px 0 0;
	float: right;
	display: block;
}

div.logo-left p,
div.logo-right p{
	margin: 0px;
	width: 390px;
	word-wrap: break-word; 
	word-break: normal; 
	padding-bottom: 10px;
	border-bottom: 1px solid #71A491;
	height: 100px;
}

/****************************************/
/*		road-map						*/
/****************************************/

#road-map{
	width: 100%;
	height: 125px;
	background: #FFF;
}

#road-map a.arrow-left{
	display: block;
	background-image: url('../images/arrow-left.png');
	width: 35px;
	height: 35px;
	float: left;
	margin: 70px 0 0 0;
}

#road-map a.arrow-right{
	display: block;
	background-image: url('../images/arrow-right.png');
	width: 35px;
	height: 35px;
	float: left;
	margin: 70px 0 0 0;
}

#road-map div.content{
	margin: 0px -2px;
	width: 851px;
	height: 100%;
	float: left;
	overflow: hidden;
	background-repeat: repeat-x;
	background-image: url('../images/history-line.png');
	position: relative;
}

#road-map ul{
	display: block;
	margin-top: 52px;
	width: 9999px;
	position: absolute;
}

#road-map li{
	float: left;
	display: block;
	width: 100px;
}

#road-map a{
	font-size: 16px;
	font-weight: bold;
}

#road-map a.circle{
	display: block;
	width: 50px;
	height: 31px;
	background-image: url('../images/history-circle.png');
	background-repeat: no-repeat;
	background-position: 6px 0;
}

/****************************************/
/*		road-class						*/
/****************************************/

#road-class{
	margin: 10px 20px;
}

#road-class ul li:first{
	margin-left: 0px;
}

#road-class ul li{
	margin-left: 30px;
	float: left;
}

#road-class a{
	color: #888;
	background: url('../images/arrow_state_grey_right.png') no-repeat;
	padding-left: 18px;
}

#road-class ul li.active a{
	background: url('../images/arrow_state_grey_expanded.png') no-repeat;
	color: #126748;
}

/****************************************/
/*		history-map						*/
/****************************************/

#history-map{
	margin-top: 30px;
}

#history-map h3 a{
	font-size: 16px;
}
#history-map li{
	display: block;
}

#history-map li a,
#history-map li div.content{
	float: left;
	line-height: 200%;
}

#history-map li div.content{
	border-bottom: 1px dashed #126748;
	margin: 0 0 20px 10px;
	padding-bottom: 20px;
	width: 843px;
}

/****************************************/
/*		menu      						*/
/****************************************/

div.menu{
	background-color: #E8E8E8;
	width: 215px;
	height: 100%;
}

div.menu div.unit{
	margin: 10px 0 0 0;
	padding-bottom: 10px;
	border-bottom: 2px solid #3F9569;
}

div.menu img{
	margin: 0 5px 0 20px;
}

div.menu img{
	color: #3F9569;
}

/****************************************/
/*		pager      						*/
/****************************************/

div.pager{
	margin:10px auto;
	height: 30px;
}

div.pager a {
	float: left;
	display: inline;
	margin-left: 10px;
	padding: 3px 6px;
	height: 20px;
	border: 1px solid #E8E8E8;
	color: #000;
	background: #FFFFFF;
	font-weight: normal;
}

div.pager a:hover {
	background: #F7F7F7;
}

div.pager a.selected {
	background: #126748;
	color: #FFFFFF;
}

/****************************************/
/*		images-list: ;					*/
/****************************************/

div.images-list{
	margin-top: 20px;
}

/**************************************************************
	collapse
 **************************************************************/
 
div.ui-collapse{
	margin: 5px 0;
}

div.ui-collapse > h2.title-hide{background: transparent url('../images/arrow_state_grey_right.png') no-repeat left;}
div.ui-collapse > h2.title-down{background: transparent url('../images/arrow_state_grey_expanded.png') no-repeat left;}

div.ui-collapse > h2.title{
	display: block;
	color: #FFF;
	padding: 5px 5px 5px 20px;
	background-color: #126748;
	cursor: pointer;
	border: 1px solid #126748;
	margin-top: 1px;
}

div.ui-collapse > div.ui-content{
	background: #FFF;
	padding: 10px;
	border: 1px solid #ABB2AF;
	border-top: none;
	display: none;
	margin-bottom: 1px;
}
div.ui-collapse > div.active{
	display: block;
}

/**************************************************************
	result
 **************************************************************/
 
 div.result{
 	padding: 20px 0 20px 3px;
 	border-bottom: 1px dashed #126748;
 }

 div.result a,
 div.result p{
	word-wrap: break-word; 
	word-break: normal; 
 }


 div.result a.title{
 	display: block;
 	color: #494949;
 	text-decoration: none;
 	font-weight: normal;
	margin-bottom: 5px;
 }

 div.result p.url{
 	color: #126748;
 	font-weight: bold;
	margin-bottom: 5px;
 }
 
/**************************************************************
	about us
 **************************************************************/
 
 ul.about-list{
 
 }
 
 ul.about-list li{
	float: left;
	display: block;
	padding:5px 20px;
 }
 
 ul.about-list a{
	text-transform: uppercase;
	padding: 5px;
	font: 12px Arial, Verdana, Helvetica, sans-serif;
	font-weight: bold;
 }
 
 ul.about-list a:hover{
	color: #FFF;
	background-color: #126748;
 }