@charset "utf-8";
/* CSS Document */
@import url(main.css); 
body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #666666;
	margin: 0; /* 比較好的做法是將 Body 元素的邊界與欄位間隔調整為零，以處理不同的瀏覽器預設值 */
	padding: 0;
	text-align: center; /* 這樣會讓容器在 IE 5* 瀏覽器內置中對齊。然後，文字會在 #container 選取器中設定為靠左對齊預設值 */
	color: #333333;
}

a{
  font-size:13px;
  color:#72371D;
  text-decoration:none;
}
a:hover{
  font-size:13px;
  color:#333333;
}
/* 彈性版面的提示
1. 由於彈性版面的整體尺寸調整是以使用者的預設字體大小為基礎，所以比較無法預期。如果正確使用，它們也會比需要較大字體大小的版面更容易存取，這是因為行長度會維持一定比例。
2. 這種版面的 Div 尺寸調整是以 Body 元素中的 100% 字體大小為基礎。如果您在 Body 元素或 #container 上使用 font-size: 80% 藉以減少整體文字大小，請記住，整個版面將會依比例縮小。您可能會想要增加各種 Div 的寬度來補償這種情況。
3. 如果字體尺寸調整是以不同的量在每個 Div 而非整體設計上變更 (亦即：#sidebar1 指定為 70% 字體大小而 #mainContent 指定為 85% 字體大小)，這樣就會依比例變更每個 Div 的整體大小。您可能會想要根據最終的字體尺寸進行調整。
*/
.thrColElsHdr #container {
	width: 980px;  /* 如果文字保持瀏覽器的預設字體大小，這個寬度將會建立可容納在 980px 瀏覽器視窗中的容器 */
	background: #FFFFFF;
	margin: 0 auto; /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	border: 1px solid #000000;
	text-align: left; /* 這樣做會覆寫 Body 元素上的 text-align: center。 */
}
.thrColElsHdr #containerInner {
	width: 980px;  /* 如果文字保持瀏覽器的預設字體大小，這個寬度將會建立可容納在 980px 瀏覽器視窗中的容器 */
	background: #FFFFFF;
	margin: 0 auto; /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	border: 1px solid #000000;
	text-align: left; /* 這樣做會覆寫 Body 元素上的 text-align: center。 */
	padding-top:40px;
}
.thrColElsHdr #header {
	background: #FFF;
	background:url(../../images/indexTitle.jpg) no-repeat;
	height:150px;
	padding: 0 opx;  /* 這個欄位間隔符合下面顯示的 Div 中，元素的靠左對齊。如果在 #header 中使用影像而非文字，您可能會想要移除欄位間隔。 */
}
/* sidebar1 的提示：
1. 請注意，如果您在這個 Div 上設定 font-size 值，Div 的整體寬度將加以調整。
2. 因為我們是以 em 為單位進行工作，所以最好不要在邊列本身上使用欄位間隔。它將會新增至寬度，而讓符合標準的瀏覽器建立不明的實際寬度。 
3. 您可以根據在 ".thrColElsHdr #sidebar1 p" 規則中看見的方式，將左和右邊界放置於 Div 內部的元素上，藉以建立 Div 側邊與內部元素之間的空間。
*/
.thrColElsHdr #sidebar1 {
	float: left;
	width: 16.5em; /* 因為這個元素是浮動元素，所以您必須指定寬度 */
	padding:15px 0px 10px 0px; /* 頂端和底部欄位間隔會在這個 Div 內部建立視覺空間 */
	*padding:15px 0px 10px 0px; /* 頂端和底部欄位間隔會在這個 Div 內部建立視覺空間 */
	_padding:0px 0px 10px 0px; /* 頂端和底部欄位間隔會在這個 Div 內部建立視覺空間 */
	margin:0px 3px;
	font-size:0.8em;
}
.thrColElsHdr #sidebar2 {
	float: right;
	width: 17em; /* 因為這個元素是浮動元素，所以您必須指定寬度 */
	padding: 15px 0; /* 頂端和底部欄位間隔會在這個 Div 內部建立視覺空間 */
	font-size:0.8em;
	margin-left:-30px;
	padding-top:20px;
	*padding-top:20px;
	_padding-top:0px;
	_margin-top:0px;

}
/* mainContent 的提示：
1. 如果您針對這個 #mainContent Div 和 #sidebar1 Div 指定不同的 font-size 值，則 #mainContent Div 的邊界將會以其 font-size 為基礎，而 #sidebar1 Div 的寬度將會以其 font-size 為基礎。您可能會想要調整這些 Div 的值。
2. mainContent 和 sidebar1 之間的空間是以 mainContent Div 的左邊界建立的。不論 sidebar1 Div 包含多少內容，欄空間將維持不變。當 #sidebar1 的內容結束時，如果您想讓 #mainContent Div 的文字填滿 #sidebar1 的空間，就可以移除這個左邊界。
3. 若要避免浮動遺失，您可能需要進行測試以便判斷約略的影像/元素大小上限，因為這個版面是以使用者的字體尺寸結合您所設定的值為基礎。不過，如果使用者將他們的瀏覽器字體大小設定為低於一般大小，#mainContent Div 中的可用空間將會比您在測試時看見的空間更少。
4. 在下列 Internet Explorer 條件註解中，縮放屬性是用來提供 mainContent "hasLayout"。這樣做可避免許多可能會發生的 IE 特有錯誤。
*/
.thrColElsHdr #mainContent {
     margin: 0 14.5em 0 14em; /* 右邊界的指定方式可以使用 em 或像素為單位。它會在頁面的右下方建立空間。 */
	*margin: 0 14.5em 0 14em;
	_margin: 0 13.5em 0 14em;
	padding-bottom:30px; 
}
.thrColElsHdr #footer {
	padding: 0 10px; /* 這個欄位間隔符合上面顯示的 Div 中，元素的靠左對齊。 */
	background:url(../../images/Footer_BG.jpg) repeat-x;
}
.thrColElsHdr #footer p {
	margin: 0; /* 將頁尾中第一個元素的邊界調整為零可避免邊界收合的可能性 (Div 之間出現的空間) */
	padding: 10px 0; /* 這個元素的欄位間隔將會建立空間，就如同邊界一樣，但是沒有邊界收合的問題 */
}
/* 可重複使用的雜項類別 */
.fltrt { /* 這個類別可用來讓頁面右邊的元素浮動。浮動元素必須位於頁面上必須相鄰的元素前面。 */
	float: right;
	margin-left: 8px;
}
.fltlft { /* 這個類別可用來讓頁面左邊的元素浮動 */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* 這個類別應該放置於 Div 或 Break 元素上，而且應該是完整包含浮動的容器關閉前的最後一個元素 */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
/* 一般共同樣式 */

.FCRed {
	color:#cc3300;
}
.FCWhite {
	color:white;
}
.FBold {
	font-weight:bold;
}
.FSNormal {
	font-size:0.8em;
}
.FCBlack {
	color:black;
}
.TAC {
	text-align:center;
}
.FloatL {
	float:left;
}
.FloatR {
	float:right;
}

ul{
	margin: 0;
	padding: 0;
}

li{
list-style-type: none;
padding-bottom: 1px;
padding-left:20px;
background:url(../../images/icon_arrow.gif) no-repeat 2px 0;
}

img {border:0}
 
/* 右側連結樣式 */
.thrColElsHdr #sidebar2 a:link {
	color: #125f6b;
	text-decoration:none;
}
.thrColElsHdr #sidebar2 a:visited {
	color: #125f6b;
	text-decoration:none;
}
.thrColElsHdr #sidebar2 a:hover {
	color: #fa7226;
	text-decoration:underline;
}
.thrColElsHdr #sidebar2 a:active {
}

/* 左側樣式 */
.thrColElsHdr #sidebar1 a:link {
	color: #125f6b;
	text-decoration:none;
}
.thrColElsHdr #sidebar1 a:visited {
	color: #125f6b;
	text-decoration:none;
}
.thrColElsHdr #sidebar1 a:hover {
	color: #fa7226;
	text-decoration:underline;
}
.thrColElsHdr #sidebar1 a:active {
}
.indexLeftTitle {
	background:url(../../images/index-left-SecTitle.gif) no-repeat;
	width:217px;
	height:34px;
	padding:10px 0px 0px 0px;
	font-size:1.2em;
	color:#FFF;
	font-weight:bold;
}
.blogDescription {
	padding:5px;
	margin-bottom:5px;
	margin-right:10px;
	border:1px solid #999;
	font-size:0.6em;
}
.indexTextBanner {
	font-size:0.8em;
	text-align:left;
	padding-right:10px;
	padding-left:10px;
	}
.indexTextBanner a:link {
	color: #993333;
	text-decoration:none;
}
.indexTextBanner a:visited {
	color: #993333;
	text-decoration:none;
}
.indexTextBanner a:hover {
	color: #ff3300;
	text-decoration:underline;
}
.indexTextBanner a:active {
}

.blogIndexPost {
	height:120px;
	width:505px;
	background:url(../../images/index-center-post-BG.gif) no-repeat;
	margin-top:0px;
	position:relative;
}
.blogIndexPost a:link {
	color: #333;
	text-decoration:none;
}
.blogIndexPost a:visited {
	color: #333;
	text-decoration:none;
}
.blogIndexPost a:hover {
	color: #ff3300;
	text-decoration:underline;
}
.blogIndexPost a:active {
}
.blogIndexPostPhoto {
	margin:10px 0px 5px 5px;
	padding:5px 5px 3px 5px;
	border:1px solid #CCCCCC;
}
.blogIndexPostContent {
	padding-top:10px;
	font-size:0.8em;
	line-height:1.5em;
}
.blogIndexPostFooter {
	height:30px;
	width:522px;
	background:url(../../images/index-center-post-Footer.gif) no-repeat;
	font-size:0.8em;
	padding-top:5px;
}

.indexRightTitle {
	background:url(../../images/index-right-titleBG.gif) no-repeat;
	width:195px;
	height:22px;
	margin-right:3px;
	padding-top:2px;
	color:white;
	}

/*標籤雲樣式 */
headerTopLink
#TagCloud
{
    font-family: Arial;
    width:100%;
    text-align: center;
}

#TagCloud a
{
    text-decoration: none;
    margin:3px;
	line-height: 20px;
}

#TagCloud a:hover
{
    color: #ff6600;
    background-color:#FFFFFF; 
    text-decoration:underline;
}

#TagCloud a:visited
{

}

.rank5 a,.rank5 a:visited{font-size:12px;color: #999}
.rank4 a,.rank4 a:visited{font-size:14px;color: #0099CC}
.rank3 a,.rank3 a:visited{font-size:16px;color: #0099CC;font-weight:bold}
.rank2 a,.rank2 a:visited{font-size:18px;color: #F39700;font-weight:bolder}
.rank0 a,.rank0 a:visited,.rank1 a,.rank1 a:visited{font-size:24px;color: #F39700;font-weight:bolder}

<!--
[if IE]> <style type="text/css"> /* 在這個條件註解中，放置所有 IE 版本的 CSS 修正 */
.thrColElsHdr #sidebar1, .thrColElsHdr #sidebar2 {
padding-top: 0px;
}
.thrColElsHdr #mainContent {
	zoom: 1;
	padding-top:20px;
	*padding-top:30px;
	_padding-top:20px;
}
/* 上面的專用縮放屬性會提供 IE 所需的 hasLayout，以避免許多錯誤 */
</style> <![endif]
-->