/***********************************************/
/* twoColFixRtHdr.css                          */
/* Use with Inalways website 2010 all.html     */
/***********************************************/

/***********************************************/
/* HTML tag styles                             */
/***********************************************/ 

@charset "utf-8";
body {
	font: 80% Geneva, Arial, Helvetica, sans-serif;
	color: #666666;
	line-height: 1.5;
	text-align: center;  /* 這樣會讓容器在 IE5 瀏覽器內置中對齊。然後，文字會在 #container 選取器中設定為靠左對齊預設值 */
	margin: 0;  /* 比較好的做法是將 Body 元素的邊界與欄位間隔調整為零，以處理不同的瀏覽器預設值 */
	padding: 0;
	background-color: #292929;
}

a:link, a:visited {
    color: #19528F;
	text-decoration: none;
}   /* overrides decoration from previous rule for visited links */

a:hover {
	color: #F38E11;
	text-decoration: none;
}   /* overrides decoration from previous rule for hovered links */

h1, h2, h3, h4, h5, h6 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
}

h1 {
	font-size: 200%;
	font-weight:100;
    color: #333333;
	margin-top: 0;
}

h2 {
	font-size: 150%;
	font-weight:100;
	color: #999999;
	margin-top: -28px;
}

h3 {
	font-size: 120%;
    color: #333333;
	margin-top: 30px;
	margin-bottom: -10px;
}

h4 {
	font-size: 120%;
    color: #333333;
	margin-top: 0;
	margin-bottom: -10px;
}   /* 用於頁面 Product List */

h5 {
	font-size: 120%;
	color: #19528F;
	margin-bottom: -10px;
}

h6 {
	font-size: 120%;
	color: #19528F;
	margin-bottom: 0;
}   /* 用於頁面 Product Main */

ul {
	list-style-image: url(../_images/nav_point_blue.gif);
	margin-left: -20px;
}

p {
    text-align: justify;
}

em {
    font-style: normal;
	color: #EF5595;
}

label {
    font-style: normal;
	color: #000000;
}

hr {
    border: none;
    background-color: #CCCCCC; /* 適用於 IE8 以後之版本。 */
    color: #CCCCCC; /* 適用於 IE8 以前之版本。 */
    height: 1px;
    width: 100%;
}   /* 分隔線，線條上下會產生空白隔間。 */


/* underLine styles ****************************/

.linSolid {
    border-bottom: 1px solid #CCCCCC;
}   /* 實線 */

.linDotted {
    border-bottom: 1px dotted #CCCCCC;
}   /* 點線 */

.linDashed {
    border-bottom: 1px dashed #CCCCCC;
}   /* 虛線 */


/* imgApp styles *******************************/

.imgBorder {
	border: 1px solid #CCCCCC;
}   /* 影像邊框元素 */

.imgFloat {
    float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}   /* 影像浮動元素 */

.cleBorder {
	border: 0;
}   /* 清除邊框元素，這個類別應該放置於影像標籤內，如：<img class="cleBorder" src="....." />。 */

.cleFloat {
    clear: both;
}   /* 清除浮動元素，這個類別應該放置於 Div 或 Break 元素上，而且應該是完整包含浮動的容器關閉前的最後一個元素。 */

.imgTag {
	border: 1px solid #999999;
	padding: 12px;
	background-color: #FFFFFF;
}   /* 影像標籤元素 */

.imgTag a:link, .imgTag a:visited {
    display: block; /* 非常重要!! 若不設置，在 IE8 將無法正常顯示。 */
	border: 1px solid #CCCCCC;
}

.imgTag a:hover {
	border: 1px solid #19528F;
}
/*-- end #imgTag --*/

.imgFlotag {
	border: 1px solid #CCCCCC;
    float: left;
	padding: 12px;
	margin-top: 30px;
	margin-right: 20px;
	background-color: #FFFFFF;
}   /* 影像連結元素 */

.imgFlotag a:link, .imgFlotag a:visited {
    display: block; /* 非常重要!! 若不設置，在 IE8 將無法正常顯示。 */
	border: 1px solid #CCCCCC;
}

.imgFlotag a:hover {
	border: 1px solid #19528F;
}
/*-- end #imgFlotag --*/

.imgLink {
	border: 1px solid #CCCCCC;
}   /* 影像連結元素 */

.imgLink a:link, .imgLink a:visited {
    display: block; /* 非常重要!! 若不設置，在 IE8 將無法正常顯示。 */
}

.imgLink a:hover {
	filter: Alpha(Opacity=50);
}
/*-- end #imgLink --*/

.imgFlolink {
	border: 1px solid #CCCCCC;
    float: left;
	margin-right: 20px;
}   /* 影像連結元素 */

.imgFlolink a:link, .imgFlolink a:visited {
    display: block; /* 非常重要!! 若不設置，在 IE8 將無法正常顯示。 */
}

.imgFlolink a:hover {
	filter: Alpha(Opacity=50);
}
/*-- end #imgFlolink --*/

.imgNav {
    margin-top: 5px;
    margin-bottom: 20px;
}   /* 影像連結元素 */

.imgNav a:link, .imgNav a:visited {
    display: block; /* 非常重要!! 若不設置，在 IE8 將無法正常顯示。 */
}

.imgNav a:hover {
	filter: Alpha(Opacity=50);
}
/*-- end #imgNav --*/


/* txtApp styles *******************************/

.txtTitle {
	font: bold 130% Georgia, Times, serif;
	color: #F38E11;
}   /* 首頁-分類文字元素。 */

.txtTitle a:link, .txtTitle a:visited {
    color: #F38E11;
	text-decoration: none;
}

.txtTitle a:hover {
    color: #CCCCCC;
	text-decoration: none;
}
/*-- end #txtTitle --*/

.txtHead {
    font: bold 110% Geneva, Arial, Helvetica, sans-serif;
	color: #19528F;
	margin-top: 0;
	margin-bottom: -8px;
}   /* 首頁-標題文字元素。 */

.txtMain {
    font: 80% Geneva, Arial, Helvetica, sans-serif;
	color: #F38E11;
}   /* 首頁-內容文字元素。 */

.txtTag {
	font: italic 80% Georgia, Times, serif;
	color: #19528F;
	margin-top: 5px;
}   /* 文字標籤元素 */

.txtAnchor {
	font: bold 80% sans-serif;
	text-align: right;
}   /* 命名錨點元素 */

.txtAnchor a:link, .txtAnchor a:visited {
    color: #666666;
	text-decoration: none;
}

.txtAnchor a:hover {
    color: #19528F;
	text-decoration: none;
}
/*-- end #txtAnchor --*/

.arrowNs {
	list-style-image: url(../_images/nav_arrowns.gif);
	margin-top: 0;
	margin-left: -20px;
}

.arrownsBlank {
	list-style-image: url(../_images/nav_arrowns_blank.gif);
}


/***********************************************/ 
/* Div tag styles                              */
/***********************************************/ 

/* Master Div */
/***********************************************/ 

.twoColFixRtHdr #header {
	width: 100%;
	height: 124px;
	margin: 0 auto;  /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	background-color: #0A4583;
	background-image: url(../_images/bg_header.gif);
	background-repeat: repeat-x;
}
/*-- end #header --*/

.twoColFixRtHdr #main {
	width: 100%;
	height: 100%;
	margin: 0 auto;  /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	background-color: #F5F5F5;
}
/*-- end #main --*/

.twoColFixRtHdr #footer { 
	width: 100%;
	height: 32px;
	margin: 0 auto;  /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	background-color: #292929;
}
/*-- end #footer --*/


/* Slave Div */
/***********************************************/ 

/* headDiv styles ******************************/

.twoColFixRtHdr #headMain {
	width: 852px;
	height: 124px;
	margin: 0 auto;  /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	background-image: url(../_images/bg_headMain.gif);
	background-repeat: no-repeat;
	background-position: center top;
}
/*-- end #headMain --*/

.twoColFixRtHdr #headLogo {
	float: left;  /* 因為這個元素是浮動元素，所以您必須指定寬度 */
    width: auto;
	margin: -74px 0 0 19px;
}
/*-- end #headLogo --*/

.twoColFixRtHdr #headBar {
	font: 75% sans-serif;
	color: #999999;
	text-align: right;
	float: right;  /* 因為這個元素是浮動元素，所以您必須指定寬度 */
	width: auto;
	margin: -98px 10px 0 0;
}

.twoColFixRtHdr #headBar ul {
    list-style: none;
	margin: 0;
	padding: 0;
}

.twoColFixRtHdr #headBar li {
    display: inline;
	white-space: nowrap;
	padding-left: 2px;
}

.twoColFixRtHdr #headBar li a:link, #headBar li a:visited {
	color: #999999;
	text-decoration: none;
}

.twoColFixRtHdr #headBar li a:hover {
	color: #FFFFFF;
	text-decoration: none;
}
/*-- end #headBar --*/

.twoColFixRtHdr #headLink {
	font: bold 120% sans-serif;
	color: #FFFFFF;
	text-align: right;
	float: right;  /* 因為這個元素是浮動元素，所以您必須指定寬度 */
	width: auto;
	margin: 82px 9px 0 0;
}

.twoColFixRtHdr #headLink ul {
    list-style: none;
	height: 27px;
	margin: 0;
}

.twoColFixRtHdr #headLink li {
    display: inline;
	white-space: nowrap;
	padding: 0 10px;
}

.twoColFixRtHdr #headLink li a:link, #headLink li a:visited {
	color: #FFFFFF;
	text-decoration: none;
}

.twoColFixRtHdr #headLink li a:hover {
	color: #999999;
	text-decoration: none;
}
/*-- end #headLink --*/


/* mainDiv styles ***************************/

.twoColFixRtHdr #movie {
	width: 850px;
	height: 160px;
	margin: 0 auto;  /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	padding: 6px 0 13px;	
	background-color: #FFFFFF;
	background-image: url(../_images/bg_movie.gif);
	background-repeat: no-repeat;
	border-left: 1px solid #E7E7E7;
	border-right: 1px solid #E7E7E7;
}
/*-- end #movie --*/

.twoColFixRtHdr #index { 
	width: 850px;
	height: 100%;
	margin: 0 auto;  /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	text-align: left;  /* 這樣做會取代 Body 元素上的 text-align: center。 */
	background-color: #F2F2F2;
	background-image: url(../_images/bg_container.gif);
	border-left: 1px solid #E7E7E7;
	border-right: 1px solid #E7E7E7;
}   /* 適用於【首頁-內容】主要區塊
/*-- end #index --*/

.twoColFixRtHdr #container { 
	width: 850px;
	height: 100%;
	margin: 0 auto;  /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	text-align: left;  /* 這樣做會取代 Body 元素上的 text-align: center。 */
	background-color: #F2F2F2;
	border-left: 1px solid #E7E7E7;
	border-right: 1px solid #E7E7E7;
}   /* 適用於【內頁-內容】主要區塊
/*-- end #container --*/

.twoColFixRtHdr #homeContent {
    margin-right: 340px;  /* 這個元素的右邊界會沿著頁面右邊向下建立欄 – 不論 sideBar1 Div 包含多少內容，欄空間將維持不變。 */
	padding: 30px;  /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	background-color: #FFFFFF;
	border-right: 2px solid #E7E7E7;
}   /* 適用於【首頁-左邊】主要區塊。*/
/*-- end #homeContent --*/

.twoColFixRtHdr #mainContent {
    margin-right: 180px;  /* 這個元素的右邊界會沿著頁面右邊向下建立欄 – 不論 sideBar1 Div 包含多少內容，欄空間將維持不變。 */
	padding: 30px;  /* 請記住，欄位間隔就是 Div 方塊內部的空間，而邊界就是 Div 方塊外部的空間 */
	background-color: #FFFFFF;
	border-right: 2px solid #E7E7E7;
}   /* 適用於【內頁-左邊】主要區塊。*/
/*-- end #mainContent --*/

.twoColFixRtHdr #homeSide {
	float: right;  /* 因為這個元素是浮動元素，所以您必須指定寬度 */
	width: 300px;  /* 在符合標準的瀏覽器或 Internet Explorer 的標準模式中，這個 Div 的實際寬度 (除了寬度以外) 將會包含欄位間隔和邊框 */
	padding: 20px;
}   /* 適用於【首頁-右邊】主要區塊。*/
/*-- end #homeSide --*/

.twoColFixRtHdr #mainSide {
	float: right;  /* 因為這個元素是浮動元素，所以您必須指定寬度 */
	width: 140px;  /* 在符合標準的瀏覽器或 Internet Explorer 的標準模式中，這個 Div 的實際寬度 (除了寬度以外) 將會包含欄位間隔和邊框 */
	padding: 20px;
}   /* 適用於【內頁-右邊】主要區塊。*/
/*-- end #mainSide --*/

.twoColFixRtHdr #navPath {
	font: italic 80% sans-serif;
	color: #19528F;
	text-align: left;
	width: auto;
	padding: 5px 20px;
}

.twoColFixRtHdr #navPath ul {
    list-style: none;
	margin: 0;
	padding: 0;
}

.twoColFixRtHdr #navPath li {
    display: inline;
	white-space: nowrap;
	padding: 0 10px;
	background-image: url(../_images/nav_arrowdp.gif);
	background-repeat: no-repeat;
	background-position: left center;
}

.twoColFixRtHdr #navPath li a:link, #navPath li a:visited {
    color: #999999;
	text-decoration: none;
}

.twoColFixRtHdr #navPath li a:hover {
    color: #19528F;
	text-decoration: none;
}
/*-- end #navPath --*/

.twoColFixRtHdr #navigation {
	font: 100% sans-serif;
    width: 100%;
}

.twoColFixRtHdr #navigation ul {
    list-style: none;
	margin: 0;
	padding: 0;
}

.twoColFixRtHdr #navigation li {
    border-bottom: 1px solid #CCCCCC;  /* (每一項主功能選單) 之間的間隙(分隔線)設定，若不需要設定顏色時，請改用 (margin-bottom: 1px;) 代替。 */
}

.twoColFixRtHdr #navigation li a:link, #navigation li a:visited {
    color: #19528F;
    display: block;
	padding: 5px;
	text-decoration: none;
}

.twoColFixRtHdr #navigation li a:hover {
    color: #FFFFFF;
    background-color: #19528F;
}

/* 以下次功能選單元素若不作任何設定，將繼承父階選單樣式。 */
.twoColFixRtHdr #navigation ul ul {
	font: 100% Georgia, Times, serif;
	color: #333333;  /* 這個顏色的設置，是取消繼承父階選單(當沒有作任何連結時)的樣式。 */
	margin-left: 0;  /*  這個間隙的設置，是為次功能選單(整體)作向右縮排而設置。 */
	margin-bottom: 10px;  /*  這個間隙的設置，是為次功能選單(整體)作向上區隔而設置。 */
}

.twoColFixRtHdr #navigation ul ul li {
	border: none;  /* 這個間隙的設置，是取消繼承父階選單之間的間隙(分隔線)的樣式。 */
	white-space: nowrap;
	margin-left: 5px;
	padding-left: 5px;
	background-image: url(../_images/nav_arrow.gif);
	background-repeat: no-repeat;
	background-position: left center;
}

.twoColFixRtHdr #navigation ul ul a:link, #navigation ul ul a:visited {
    color: #333333;
}

.twoColFixRtHdr #navigation ul ul a:hover {
    background-color: #F2F2F2;  /* 這個間隙的設置，是取消繼承父階選單(連結時底色)的樣式, 由於無法使用"none"值，故選用和頁面底色相同之顏色替代。 */
	font: 100% Georgia, Times, serif;
	color: #F38E11;
}
/*-- end #navigation --*/


/* footDiv styles ******************************/

.twoColFixRtHdr #siteMap { 
	width: 852px;
	height: 200px;
	margin: 0 auto;  /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	background-image: url(../_images/bg_footMain.gif);
	background-repeat: repeat-y;
	background-position: center top;
}
/*-- end #footMain --*/

.twoColFixRtHdr #footMain { 
	width: 852px;
	height: 32px;
	margin: 0 auto;  /* 自動邊界 (搭配寬度) 會讓頁面置中對齊 */
	background-image: url(../_images/bg_footMain.gif);
	background-repeat: repeat-y;
	background-position: center top;
}
/*-- end #footMain --*/

.twoColFixRtHdr #footBar {
	font: italic 80% Georgia, Times, serif;
	color: #999999;
	text-align: left;
	float: left;  /* 因為這個元素是浮動元素，所以您必須指定寬度 */
    width: auto;
	margin: 10px 20px 0;
}
/*-- end #footBar --*/

.twoColFixRtHdr #footLink {
	font: 90% sans-serif;
	color: #FFFFFF;
	text-align: right;
	float: right;  /* 因為這個元素是浮動元素，所以您必須指定寬度 */
	width: auto;
	margin: 10px 20px 0;
}

.twoColFixRtHdr #footLink ul {
    list-style: none;
	margin: 0;
	padding: 0;
}

.twoColFixRtHdr #footLink li {
    display: inline;
	white-space: nowrap;
	padding-left: 2px;
}

.twoColFixRtHdr #footLink li a:link, #footLink li a:visited {
	color: #FFFFFF;
	text-decoration: none;
}

.twoColFixRtHdr #footLink li a:hover {
	color: #999999;
	text-decoration: none;
}
/*-- end #footLink --*/