"MediaWiki:Common.css" 修訂間的差異

出自 淡水維基館
前往: 導覽搜尋
 
(未顯示由 3 位使用者於中間所作的 87 次修訂)
行 1: 行 1:
/* 此處的 CSS 將應用於所有的面板 */
+
/* 此處的 CSS 將應用於所有的面板
 +
 
 +
/* fix google maps little man in responsive skin (20160822 Rocio) */
 +
.gm-style img {
 +
    max-width: none;
 +
}
 +
<meta name="viewport" content="width=device-width; initial-scale=1.0" /> */
 +
 
 +
/*全部的使用者都會載入這裡的 CSS。*/
 +
@media screen and (min-width: 1200px) {
 +
    // 如果使用者之視窗寬度 >= 1200px,將會再載入這裡的 CSS。
 +
}
 +
 
 +
@media screen and (min-width: 768px) and (max-width: 979px) {
 +
    // 如果使用者之視窗寬度介於 768px ~ 979px,將會再載入這裡的 CSS。   
 +
}
 +
 
 +
@media screen and (max-width: 767px) {
 +
    // 如果使用者之視窗寬度 <= 768px,將會再載入這裡的 CSS。   
 +
}
 +
 
 +
@media screen and (max-device-width: 480px) {
 +
 
 +
}
 +
 
 +
body.page-Main_Page h1.firstHeading { display: none; }
 +
 
 
#scrollDiv{width:100%;height:25px;line-height:25px; overflow:hidden}       
 
#scrollDiv{width:100%;height:25px;line-height:25px; overflow:hidden}       
 
#scrollDiv li{height:25px;padding-left:10px;list-style:none;}
 
#scrollDiv li{height:25px;padding-left:10px;list-style:none;}
行 6: 行 32:
 
#hs{
 
#hs{
 
position: relative;
 
position: relative;
overflow: hidden;
+
overflow: auto;
 
color:#333;
 
color:#333;
 
}
 
}
 
#hs-banner{
 
#hs-banner{
 
height: 200px;
 
height: 200px;
overflow: hidden;
+
overflow: auto;
 
position: relative;
 
position: relative;
 
}
 
}
行 47: 行 73:
 
         height: auto;
 
         height: auto;
 
bottom: -60%;
 
bottom: -60%;
 +
        opacity: 0.7; //透明度
 
}
 
}
 
#hs-banner-introR {
 
#hs-banner-introR {
 +
    border: 1;
 
     background: none;
 
     background: none;
 
     margin: 200px 0 0 20px;
 
     margin: 200px 0 0 20px;
行 54: 行 82:
 
     padding: 15px;
 
     padding: 15px;
 
     position: relative;
 
     position: relative;
     width: 420px;
+
     width: 500px;
 
     z-index: 1;
 
     z-index: 1;
 
     font-size: 120%;
 
     font-size: 120%;
行 62: 行 90:
 
border: 0;
 
border: 0;
 
margin-bottom: 0;
 
margin-bottom: 0;
 +
}
 +
#hs-searchR{
 +
    border: 1;
 +
    background: #FFFFFF;
 +
    margin: 50px 0px 0 0;
 +
    opacity: 0.8; //透明度
 +
    padding: 5px;
 +
    position: relative;
 +
    top:-20px;
 +
    left:40px;
 +
    z-index: 1;
 +
    float: right;
 +
    font-size: 110%;
 
}
 
}
 
<!--以上為R設定-->
 
<!--以上為R設定-->
行 118: 行 159:
 
#hs .column1{
 
#hs .column1{
 
float: left;
 
float: left;
width: 48%;
+
width: 49%;
margin-right: 2%; //右邊界
+
margin-right: 1%;
 
}
 
}
 
#hs .column2{
 
#hs .column2{
float: right;
+
float: left;
width: 45%;
+
width: 50%;
margin-right: 3%;
 
 
}
 
}
 
#hs .column h2, #hs .column h3{
 
#hs .column h2, #hs .column h3{
行 138: 行 178:
 
}
 
}
 
#hs .right{
 
#hs .right{
float:right;
+
float:left;
 
}
 
}
 
#hs .first{
 
#hs .first{
 
  clear:left;
 
  clear:left;
 
}
 
}
 +
/*借我(Vanya)做首頁*/
 +
 +
#sample{
 +
width:749px;
 +
height:287px;
 +
background:url(http://tamsui.dils.tku.edu.tw/wiki/images/b/b8/%E6%B7%A1%E6%B0%B4TAMSUI.jpg)
 +
no-repeat; /*讓ie6能有固定在#sample的效果*/
 +
}
 +
/*下拉*/
 +
#pmenu, #pmenu ul {
 +
    margin: 0;
 +
    padding: 0;
 +
    text-decoration: none;
 +
    list-style: none;
 +
}
 +
#pmenu {
 +
    margin:25px 0 200px 15px;
 +
}
 +
#pmenu li {
 +
    float:left;
 +
    position:relative;
 +
}
 +
#pmenu a, #pmenu a:visited {
 +
    display:block;
 +
    width:100px;
 +
    font-size:13px;
 +
    color:#000;
 +
    height:30px;
 +
    line-height:29px;
 +
    text-decoration:none;
 +
    text-indent:10px;
 +
    background:#b2ab9b;
 +
    border:1px solid #fff;
 +
    border-width:0 1px 1px 0;
 +
}
 +
#pmenu li:hover > a{
 +
    background:#dfd7ca;
 +
    color:#c00;
 +
}
 +
#pmenu li ul {
 +
    display: none;
 +
 +
}
 +
#pmenu li:hover > ul {
 +
    display:block;
 +
    position:absolute;
 +
    top:0;
 +
    left:101px;
 +
}
 +
#pmenu > li:hover > ul {
 +
    left:0;
 +
    top:31px;
 +
}
 +
/*另一個下拉*/
 +
#menuv ul{
 +
    margin: 0;
 +
    padding: 0;
 +
    font-size: 13px;
 +
    text-decoration: none; 
 +
    list-style: none;
 +
}
 +
#menuv{
 +
text-decoration: none;   
 +
list-style: none;
 +
}
 +
#menuv li {
 +
    position: relative;
 +
    float: left;
 +
}
 +
/* 選單 li 裡面連結之樣式 */
 +
#menuv li a{
 +
    display: block;
 +
    padding: 12px 20px;
 +
    background: #888;
 +
    color: #FFF;
 +
}
 +
/* 特定在第一層,以左邊灰線分隔 */
 +
#menuv li > a{
 +
    border-bottom: 1px solid #CCC;   
 +
    border-left: 1px solid #CCC;
 +
}
 +
#menuv li > a:hover{
 +
    color: #666;
 +
    background: #DDD
 +
}
 +
/* 特定在第一層 > 第二層之後下拉部分之樣式 */
 +
#menuv li ul{
 +
    display: none;
 +
    float: left;
 +
    position: absolute;
 +
    left: 0;   
 +
    margin: 0;
 +
}
 +
/* 當第一層選單被觸發時,指定第二層顯示 */
 +
#menuv li:hover > ul{
 +
    display: block;
 +
}
 +
/* 特定在第二層或之後下拉部分 li 之樣式 */
 +
#menuv ul li {
 +
    border-bottom: 1px solid #DDD;
 +
}
 +
/* 特定在第二層或之後下拉部分 li (最後一項不要底線)之樣式 */
 +
#menuv ul li:last-child {
 +
    border-bottom: none;
 +
}
 +
/* 第二層或之後 選單 li 之樣式 */
 +
#menuv ul a {
 +
    width: 120px;
 +
    padding: 10px 12px;   
 +
    color: #666;       
 +
    background: #EEE;
 +
}
 +
#menuv ul a:hover {       
 +
    background: #CCC;   
 +
}
 +
/* 第三層之後,上一層的選單觸發則顯示出來(皆為橫向拓展) */
 +
#menuv ul li:hover > ul{
 +
    display: block;
 +
    position: absolute;
 +
    top: 0;   
 +
    left: 100%;
 +
}
 +
 
/* END OF NEW home screen */
 
/* END OF NEW home screen */
  
/*試試看別的下拉*/
 
 
*/
 
 
/* Standard Navigationsleisten.*/
 
/* Standard Navigationsleisten.*/
 
   
 
   
行 197: 行 357:
 
         line-height: 1px;
 
         line-height: 1px;
 
         clear: both;
 
         clear: both;
 +
}
 +
/* 箭頭向下 */
 +
div.arrow-bottom {
 +
    display: inline-block;
 +
    margin-left: 5px;
 +
    border-top: 4px solid #FFF;
 +
    border-right: 4px solid transparent;   
 +
    border-left: 4px solid transparent;       
 +
    width: 1px;
 +
    height: 1px;
 +
}
 +
/* 箭頭向右 */
 +
div.arrow-right {
 +
    display: inline-block;
 +
    margin-left: 12px;   
 +
    border-top: 3px solid transparent;
 +
    border-bottom: 3px solid transparent;
 +
    border-left: 3px solid #666;       
 +
    width: 1px;
 +
    height: 1px;
 
}
 
}
 
span.NavToggle {
 
span.NavToggle {
行 220: 行 400:
 
}
 
}
  
 +
/*2014年5月12日Vanya測試用*/
 +
/* Align */
 +
.valign-middle, .valign-center, .va-m, .va-c { vertical-align: middle; }
 +
.valign-top, .va-t { vertical-align: top; }
 +
.valign-bottom, .va-b { vertical-align: bottom; }
 +
.alignt-middle, .alignt-center, .at-m, .at-c, .eplist { text-align: center; }
 +
.alignt-left, .at-l { text-align: left; }
 +
.alignt-right, .at-r, .collapseButton { text-align: right; }
 +
.align-middle, .align-center, .a-m, .a-c, .eplist { margin: 0 auto; }
 +
.align-left, .a-l { float: left; }
 +
.align-right, .a-r, .collapseButton, .userbox, .babelbox { float: right; }
 +
/* 圓角邊框 */
 +
.roundy { border-radius: 10px; }
 +
.roundytl { border-top-left-radius: 10px; }
 +
.roundytr { border-top-right-radius: 10px; }
 +
.roundybl { border-bottom-left-radius: 10px; }
 +
.roundybr { border-bottom-right-radius: 10px; }
 +
.roundytop { border-top-left-radius: 10px; border-top-right-radius: 10px; }
 +
.roundyright { border-bottom-right-radius: 10px; border-top-right-radius: 10px; }
 +
.roundybottom { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
 +
.roundyleft { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
 +
.roundy-10 { border-radius: 10px; }
 +
.roundytl-10 { border-top-left-radius: 10px; }
 +
.roundytr-10 { border-top-right-radius: 10px; }
 +
.roundybl-10 { border-bottom-left-radius: 10px; }
 +
.roundybr-10 { border-bottom-right-radius: 10px; }
 +
.roundytop-10 { border-top-left-radius: 10px; border-top-right-radius: 10px; }
 +
.roundyright-10 { border-bottom-right-radius: 10px; border-top-right-radius: 10px; }
 +
.roundybottom-10 { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
 +
.roundyleft-10 { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
 +
.roundy-4 { border-radius: 4px; }
 +
.roundytl-4 { border-top-left-radius: 4px; }
 +
.roundytr-4 { border-top-right-radius: 4px; }
 +
.roundybl-4 { border-bottom-left-radius: 4px; }
 +
.roundybr-4 { border-bottom-right-radius: 4px; }
 +
.roundytop-4 { border-top-left-radius: 4px; border-top-right-radius: 4px; }
 +
.roundyright-4 { border-bottom-right-radius: 4px; border-top-right-radius: 4px; }
 +
.roundybottom-4 { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; }
 +
.roundyleft-4 { border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
 +
.roundy-5 { border-radius: 5px; }
 +
.roundytl-5 { border-top-left-radius: 5px; }
 +
.roundytr-5 { border-top-right-radius: 5px; }
 +
.roundybl-5 { border-bottom-left-radius: 5px; }
 +
.roundybr-5 { border-bottom-right-radius: 5px; }
 +
.roundytop-5 { border-top-left-radius: 5px; border-top-right-radius: 5px; }
 +
.roundyright-5 { border-bottom-right-radius: 5px; border-top-right-radius: 5px; }
 +
.roundybottom-5 { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }
 +
.roundyleft-5 { border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
 +
.roundy-6 { border-radius: 6px; }
 +
.roundytl-6 { border-top-left-radius: 6px; }
 +
.roundytr-6 { border-top-right-radius: 6px; }
 +
.roundybl-6 { border-bottom-left-radius: 6px; }
 +
.roundybr-6 { border-bottom-right-radius: 6px; }
 +
.roundytop-6 { border-top-left-radius: 6px; border-top-right-radius: 6px; }
 +
.roundyright-6 { border-bottom-right-radius: 6px; border-top-right-radius: 6px; }
 +
.roundybottom-6 { border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; }
 +
.roundyleft-6 { border-top-left-radius: 6px; border-bottom-left-radius: 6px; }
 +
.roundy-8 { border-radius: 8px; }
 +
.roundytl-8 { border-top-left-radius: 8px; }
 +
.roundytr-8 { border-top-right-radius: 8px; }
 +
.roundybl-8 { border-bottom-left-radius: 8px; }
 +
.roundybr-8 { border-bottom-right-radius: 8px; }
 +
.roundytop-8 { border-top-left-radius: 8px; border-top-right-radius: 8px; }
 +
.roundyright-8 { border-bottom-right-radius: 8px; border-top-right-radius: 8px; }
 +
.roundybottom-8 { border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; }
 +
.roundyleft-8 { border-top-left-radius: 8px; border-bottom-left-radius: 8px; }
 +
.roundy-15 { border-radius: 15px; }
 +
.roundytl-15 { border-top-left-radius: 15px; }
 +
.roundytr-15 { border-top-right-radius: 15px; }
 +
.roundybl-15 { border-bottom-left-radius: 15px; }
 +
.roundybr-15 { border-bottom-right-radius: 15px; }
 +
.roundytop-15 { border-top-left-radius: 15px; border-top-right-radius: 15px; }
 +
.roundyright-15 { border-bottom-right-radius: 15px; border-top-right-radius: 15px; }
 +
.roundybottom-15 { border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; }
 +
.roundyleft-15 { border-top-left-radius: 15px; border-bottom-left-radius: 15px; }
 +
.roundy-20 { border-radius: 20px; }
 +
.roundytl-20 { border-top-left-radius: 20px; }
 +
.roundytr-20 { border-top-right-radius: 20px; }
 +
.roundybl-20 { border-bottom-left-radius: 20px; }
 +
.roundybr-20 { border-bottom-right-radius: 20px; }
 +
.roundytop-20 { border-top-left-radius: 20px; border-top-right-radius: 20px; }
 +
.roundyright-20 { border-bottom-right-radius: 20px; border-top-right-radius: 20px; }
 +
.roundybottom-20 { border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; }
 +
.roundyleft-20 { border-top-left-radius: 20px; border-bottom-left-radius: 20px; }
 +
.roundy-24 { border-radius: 24px; }
 +
.roundytl-24 { border-top-left-radius: 24px; }
 +
.roundytr-24 { border-top-right-radius: 24px; }
 +
.roundybl-24 { border-bottom-left-radius: 24px; }
 +
.roundybr-24 { border-bottom-right-radius: 24px; }
 +
.roundytop-24 { border-top-left-radius: 24px; border-top-right-radius: 24px; }
 +
.roundyright-24 { border-bottom-right-radius: 24px; border-top-right-radius: 24px; }
 +
.roundybottom-24 { border-bottom-left-radius: 24px; border-bottom-right-radius: 24px; }
 +
.roundyleft-24 { border-top-left-radius: 24px; border-bottom-left-radius: 24px; }
 +
.roundy-25 { border-radius: 25px; }
 +
.roundytl-25 { border-top-left-radius: 25px; }
 +
.roundytr-25 { border-top-right-radius: 25px; }
 +
.roundybl-25 { border-bottom-left-radius: 25px; }
 +
.roundybr-25 { border-bottom-right-radius: 25px; }
 +
.roundytop-25 { border-top-left-radius: 25px; border-top-right-radius: 25px; }
 +
.roundyright-25 { border-bottom-right-radius: 25px; border-top-right-radius: 25px; }
 +
.roundybottom-25 { border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; }
 +
.roundyleft-25 { border-top-left-radius: 25px; border-bottom-left-radius: 25px; }
 +
.roundy-30 { border-radius: 30px; }
 +
.roundytl-30 { border-top-left-radius: 30px; }
 +
.roundytr-30 { border-top-right-radius: 30px; }
 +
.roundybl-30 { border-bottom-left-radius: 30px; }
 +
.roundybr-30 { border-bottom-right-radius: 30px; }
 +
.roundytop-30 { border-top-left-radius: 30px; border-top-right-radius: 30px; }
 +
.roundyright-30 { border-bottom-right-radius: 30px; border-top-right-radius: 30px; }
 +
.roundybottom-30 { border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; }
 +
.roundyleft-30 { border-top-left-radius: 30px; border-bottom-left-radius: 30px; }
 +
.roundy-32 { border-radius: 32px; }
 +
.roundytl-32 { border-top-left-radius: 32px; }
 +
.roundytr-32 { border-top-right-radius: 32px; }
 +
.roundybl-32 { border-bottom-left-radius: 32px; }
 +
.roundybr-32 { border-bottom-right-radius: 32px; }
 +
.roundytop-32 { border-top-left-radius: 32px; border-top-right-radius: 32px; }
 +
.roundyright-32 { border-bottom-right-radius: 32px; border-top-right-radius: 32px; }
 +
.roundybottom-32 { border-bottom-left-radius: 32px; border-bottom-right-radius: 32px; }
 +
.roundyleft-32 { border-top-left-radius: 32px; border-bottom-left-radius: 32px; }
 +
.roundy-48 { border-radius: 48px; }
 +
.roundytl-48 { border-top-left-radius: 48px; }
 +
.roundytr-48 { border-top-right-radius: 48px; }
 +
.roundybl-48 { border-bottom-left-radius: 48px; }
 +
.roundybr-48 { border-bottom-right-radius: 48px; }
 +
.roundytop-48 { border-top-left-radius: 48px; border-top-right-radius: 48px; }
 +
.roundyright-48 { border-bottom-right-radius: 48px; border-top-right-radius: 48px; }
 +
.roundybottom-48 { border-bottom-left-radius: 48px; border-bottom-right-radius: 48px; }
 +
.roundyleft-48 { border-top-left-radius: 48px; border-bottom-left-radius: 48px; }
 +
.roundy-50 { border-radius: 50px; }
 +
.roundytl-50 { border-top-left-radius: 50px; }
 +
.roundytr-50 { border-top-right-radius: 50px; }
 +
.roundybl-50 { border-bottom-left-radius: 50px; }
 +
.roundybr-50 { border-bottom-right-radius: 50px; }
 +
.roundytop-50 { border-top-left-radius: 50px; border-top-right-radius: 50px; }
 +
.roundyright-50 { border-bottom-right-radius: 50px; border-top-right-radius: 50px; }
 +
.roundybottom-50 { border-bottom-left-radius: 50px; border-bottom-right-radius: 50px; }
 +
.roundyleft-50 { border-top-left-radius: 50px; border-bottom-left-radius: 50px; }
 +
.roundy-60 { border-radius: 60px; }
 +
.roundytl-60 { border-top-left-radius: 60px; }
 +
.roundytr-60 { border-top-right-radius: 60px; }
 +
.roundybl-60 { border-bottom-left-radius: 60px; }
 +
.roundybr-60 { border-bottom-right-radius: 60px; }
 +
.roundytop-60 { border-top-left-radius: 60px; border-top-right-radius: 60px; }
 +
.roundyright-60 { border-bottom-right-radius: 60px; border-top-right-radius: 60px; }
 +
.roundybottom-60 { border-bottom-left-radius: 60px; border-bottom-right-radius: 60px; }
 +
.roundyleft-60 { border-top-left-radius: 60px; border-bottom-left-radius: 60px; }
 +
.roundy-80 { border-radius: 80px; }
 +
.roundytl-80 { border-top-left-radius: 80px; }
 +
.roundytr-80 { border-top-right-radius: 80px; }
 +
.roundybl-80 { border-bottom-left-radius: 80px; }
 +
.roundybr-80 { border-bottom-right-radius: 80px; }
 +
.roundytop-80 { border-top-left-radius: 80px; border-top-right-radius: 80px; }
 +
.roundyright-80 { border-bottom-right-radius: 80px; border-top-right-radius: 80px; }
 +
.roundybottom-80 { border-bottom-left-radius: 80px; border-bottom-right-radius: 80px; }
 +
.roundyleft-80 { border-top-left-radius: 80px; border-bottom-left-radius: 80px; }
 +
.roundy-96 { border-radius: 96px; }
 +
.roundytl-96 { border-top-left-radius: 96px; }
 +
.roundytr-96 { border-top-right-radius: 96px; }
 +
.roundybl-96 { border-bottom-left-radius: 96px; }
 +
.roundybr-96 { border-bottom-right-radius: 96px; }
 +
.roundytop-96 { border-top-left-radius: 96px; border-top-right-radius: 96px; }
 +
.roundyright-96 { border-bottom-right-radius: 96px; border-top-right-radius: 96px; }
 +
.roundybottom-96 { border-bottom-left-radius: 96px; border-bottom-right-radius: 96px; }
 +
.roundyleft-96 { border-top-left-radius: 96px; border-bottom-left-radius: 96px; }
 +
.roundy-100 { border-radius: 100px; }
 +
.roundytl-100 { border-top-left-radius: 100px; }
 +
.roundytr-100 { border-top-right-radius: 100px; }
 +
.roundybl-100 { border-bottom-left-radius: 100px; }
 +
.roundybr-100 { border-bottom-right-radius: 100px; }
 +
.roundytop-100 { border-top-left-radius: 100px; border-top-right-radius: 100px; }
 +
.roundyright-100 { border-bottom-right-radius: 100px; border-top-right-radius: 100px; }
 +
.roundybottom-100 { border-bottom-left-radius: 100px; border-bottom-right-radius: 100px; }
 +
.roundyleft-100 { border-top-left-radius: 100px; border-bottom-left-radius: 100px; }
 +
/* 圆角表格样式 */
 +
.eplist tr:last-child td:first-child { border-bottom-left-radius: 6px; }
 +
.eplist tr:last-child td:last-child { border-bottom-right-radius: 6px; }
  
 
+
/* ***** ***** TimelineTable ***** ***** */
/*Vanya嘗試放放看~*/
+
table.tl_table{
/**INFOBOXES**/
+
        border-width: thin;
div.infobox {
+
        border-spacing: 2px;
float:right;
+
        border-style: outset;
position:relative;
+
        border-color: black;
width:250px;
+
        border-collapse: separate;
background:#FFF;
+
        background-color: white;
font-size:.923em;
+
        border-radius: 9px;
border:1px solid #aaa;
 
margin:0 0 1em 1em;
 
padding:0
 
 
}
 
}
 
+
div.infobox,div.nav .box {
+
th.tl_title{
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffffff,EndColorStr=#ffeeeeee);
+
        text-transform: uppercase
background-image: linear-gradient(top, #fff 0%, #eee 100%);
+
        text-align: center;
background-image: -o-linear-gradient(top, #fff 0%, #eee 100%);
+
        border-width: 1px;
background-image: -moz-linear-gradient(top, #fff 0%, #eee 100%);
+
        padding: 1px;
background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%);
+
        border-style: outset;
background-image: -ms-linear-gradient(top, #fff 0%, #eee 100%);
+
        border-color: blue;
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #eee))
+
        background-color: rgb(243, 248, 252);
 +
        border-radius: 9px;
 
}
 
}
 
+
div.infobox .icon {
+
th.tl_years{
float:right;
+
        text-align: center;
position:relative;
+
        font-style: italic;
z-index:2;
+
        border-width: 1px;
width:auto;
+
        padding: 1px;
margin:5px
+
        border-style: outset;
 +
        border-color: blue;
 +
        background-color: rgb(223, 228, 252);
 +
        border-radius: 4px;
 
}
 
}
 
+
div.infobox .icon p {
+
th.tl_months{
text-align:center;
+
        text-align: center;
color:#444;
+
        border-width: 1px;
font-size:9px!important;
+
        padding: 1px;
background-color:rgba(255,255,255,0.5);
+
        border-style: outset;
border-radius:.75em;
+
        border-color: blue;
line-height:1em;
+
        background-color: rgb(243, 248, 252);
margin:.25em -.5em;
+
        border-radius: 2px;
padding:2px
 
 
}
 
}
 
+
div.infobox .wrapper {
+
th.tl_days{
clear:both;
+
        text-align: center;
padding:0
+
        border-width: 1px;
 +
        padding: 1px;
 +
        border-style: outset;
 +
        border-color: blue;
 +
        background-color: rgb(243, 248, 252);
 +
        border-radius: 2px;
 
}
 
}
 
+
div.infobox .statistics {
+
th.tl_weeks{
text-align:center;
+
        text-align: center;
margin:0 8px
+
        border-width: 1px;
 +
        padding: 1px;
 +
        border-style: outset;
 +
        border-color: blue;
 +
        background-color: rgb(243, 248, 252);
 +
        border-radius: 2px;
 
}
 
}
 
+
div.statistics span + span { margin-left: 5px; }
+
td.tl_freetime{
 
+
        background-color: rgb(187, 210, 236);
div.infobox .heading,div.nav .heading {
+
        border-width: 1px;
font-weight:700;
+
        border-color: black;
background-image:url(http://wiki.guildwars2.com/images/c/cc/Infobox_header_overlay.png)!important;
+
        border-style: inset;
text-align:center;
+
        border-radius: 7px;
border:1px solid rgba(0,0,0,0.25);
 
border-bottom-width:0;
 
position:relative;
 
z-index:1;
 
font-size-adjust:.52;
 
margin:-1px -1px 5px!important
 
 
}
 
}
 
+
div.infobox .heading {
+
td.tl_event{
font-family:EasonPro, "Times New Roman", serif!important;
+
        text-align: center;
font-size:1.417em!important;
+
        padding: 1px;
color:#fff!important;
+
        background-color: rgb(61, 114, 194);
background-color:#444;
+
        border-width: 1px;
text-shadow:rgba(0,0,0,0.75) 0 0 .25em;
+
        border-color: white;
line-height:1.176em;
+
        border-style: inset;
font-size-adjust:.43;
+
        color: white;
padding:.5em!important
+
        border-radius: 7px;
 +
        white-space: normal
 
}
 
}
 
+
div.infobox .subheading,div.nav .subheading {
+
td.tl_foot{
font-weight:700;
+
        text-align: center;
background-color:#888;
+
        padding: 1px;
background-image:url(http://wiki.guildwars2.com/images/c/cc/Infobox_header_overlay.png)!important;
+
        background-color: rgb(243, 248, 252);
border-left:1px solid rgba(0,0,0,0.25);
+
        border-width: 1px;
border-right:1px solid rgba(0,0,0,0.25);
+
        border-color: blue;
line-height:100%;
+
        border-style: ridge;
text-align:center;
+
        color: gray;
position:relative;
+
        border-radius: 9px;
margin:0 -1px!important
 
 
}
 
}
 +
 +
thead.tl_header{}
 +
tbody.tl_body{}
 +
tfoot.tl_footer{}
  
div.infobox .subheading {
+
/* == 浮動目錄與透明度 == Add by Rocio 20150119
font-family:EasonPro, "Times New Roman", serif;
+
#toc, .toc {
font-size:1.25em!important;
+
        display: block;
color:#fff!important;
+
        position: fixed;
background-color:#444;
+
        top: 100px;
text-shadow:rgba(0,0,0,0.75) 0 0 .25em;
+
        right: 0px;
z-index:1;
+
        min-width: 200px;
line-height:1.333em;
+
        max-width: 350px;
font-size-adjust:0.43;
+
        max-height: 600px;
padding:.567em!important
+
        overflow-y: scroll;
 +
        border: 1px solid #aaa;
 +
        border-radius: 0 0 1px 1px;
 +
        -moz-border-radius: 0 0 1px 1px;
 +
        background: rgba(249,249,249,0.7);
 +
        padding: 12px;
 +
        box-shadow: 0 1px 8px #000;
 +
        -webkit-box-shadow: 0 1px 8px #000;
 +
        -moz-box-shadow: 0 1px 8px #000;
 +
}*/
 +
#toc, .toc {
 +
        background: rgba(249,249,249,0.7);
 +
        padding: 10px;
 
}
 
}
 
+
/* 測試card 20150730 */
div.nav dl,div.infobox dl {
+
.interesting_cards .cards {
margin:10px 0
+
    text-align: center;
 
}
 
}
 
+
.card {
div.infobox dt {
+
    background-color: white;
float:left;
+
    padding: 0;
text-align:right;
+
    display: inline-block;
width:78px;
+
    margin-right: .5em;
line-height:1em;
+
    margin-left: .5em;
font-weight:700;
+
    margin-top: 1em;
clear:left;
+
    border: 1px solid #d8d8d8;
border-right:2px solid #999;
+
    border-bottom: 3px solid #d5d5d5;
margin:0 -2px 0 0;
+
    text-align: center;
padding:2px 8px 2px 3px
+
    overflow: hidden;
 +
    width: 200px;
 
}
 
}
 
+
.card .info {
div.infobox dd {
+
    overflow: hidden;
float:left;
+
    border-top: 1px solid #dfdfdf;
width:125px;
+
    width: 200px;
font-weight:400;
+
    height: 2.4em;
border-left:2px solid #999;
+
    display: block;
margin:0;
 
padding:2px 7px
 
 
}
 
}
 
+
.card .info .title {
div.infobox .image_wrapper {
+
    font-size: 80%;
text-align:center;
+
    display: block;
padding:0;
+
    padding: .5em 1em .5em 1em;
margin:10px 0
+
    font-weight: bold;
 
}
 
}
  
div.infobox::after,div.nav .box::after,div.infobox .heading::after,div.nav .heading::after,div.infobox .subheading::after,div.nav .subheading::after,.table::after {
+
/* 測試手機版界面的設定 2016-10-18 (先寫進來,有空再來測試)
content:"";
+
  For portals, added 2011-12-07 -bv
position:absolute;
+
  On wide screens, show these as two columns
width:100%;
+
  On narrow and mobile screens, let them collapse into a single column */
left:0;
+
.portal-column-left {
height:3px;
+
    float: left;
background-image:url(http://wiki.guildwars2.com/images/4/45/Shadow_after.png);
+
    width: 50%;
background-size:100% 3px
 
 
}
 
}
 
+
.portal-column-right {
div.infobox::after,div.nav .box::after {bottom:-4px}
+
    float: right;
div.infobox .heading::after,div.nav .heading::after,div.infobox .subheading::after,div.nav .subheading::after,.table::after {bottom:-3px}
+
    width: 49%;
 
 
div.infobox table,div.nav table {background-color:transparent}
 
 
 
div.infobox.guardian dd,div.infobox.guardian dt {
 
border-color:#066!important
 
 
}
 
}
 
+
.portal-column-left-wide {
div.infobox.guardian .heading,div.infobox.guardian .subheading {
+
    float: left;
background-color:#066!important
+
    width: 60%;
 
}
 
}
 
+
.portal-column-right-narrow {
div.infobox.warrior dd,div.infobox.warrior dt {
+
    float: right;
border-color:#c60!important
+
    width: 39%;
 
}
 
}
 
+
.portal-column-left-extra-wide {
div.infobox.warrior .heading,div.infobox.warrior .subheading {
+
    float: left;
background-color:#c60!important
+
    width: 70%;
 
}
 
}
 
+
.portal-column-right-extra-narrow {
div.infobox.engineer dd,div.infobox.engineer dt {
+
    float: right;
border-color:#630!important
+
    width: 29%;
}
 
 
 
div.infobox.engineer .heading,div.infobox.engineer .subheading {
 
background-color:#630!important
 
}
 
 
 
div.infobox.ranger dd,div.infobox.ranger dt {
 
border-color:#360!important
 
}
 
 
 
div.infobox.ranger .heading,div.infobox.ranger .subheading {
 
background-color:#360!important
 
}
 
 
 
div.infobox.thief dd,div.infobox.thief dt {
 
border-color:#933!important
 
}
 
 
 
div.infobox.thief .heading,div.infobox.thief .subheading {
 
background-color:#933!important
 
}
 
 
 
div.infobox.elementalist dd,div.infobox.elementalist dt {
 
border-color:#c00!important
 
}
 
 
 
div.infobox.elementalist .heading,div.infobox.elementalist .subheading {
 
background-color:#c00!important
 
}
 
 
 
div.infobox.mesmer dd,div.infobox.mesmer dt {
 
border-color:#606!important
 
}
 
 
 
div.infobox.mesmer .heading,div.infobox.mesmer .subheading {
 
background-color:#606!important
 
}
 
 
 
div.infobox.necromancer dd,div.infobox.necromancer dt {
 
border-color:#063!important
 
}
 
 
 
div.infobox.necromancer .heading,div.infobox.necromancer .subheading {
 
background-color:#063!important
 
}
 
 
 
div.infobox.asura dd,div.infobox.asura dt {
 
border-color:#63c!important
 
}
 
 
 
div.infobox.asura .heading,div.infobox.asura .subheading {
 
background-color:#63c!important
 
}
 
 
 
div.infobox.charr dd,div.infobox.charr dt {
 
border-color:#900!important
 
}
 
 
 
div.infobox.charr .heading,div.infobox.charr .subheading {
 
background-color:#900!important
 
}
 
 
 
div.infobox.human dd,div.infobox.human dt {
 
border-color:#c90!important
 
}
 
 
 
div.infobox.human .heading,div.infobox.human .subheading {
 
background-color:#c90!important
 
}
 
 
 
div.infobox.norn dd,div.infobox.norn dt {
 
border-color:#069!important
 
}
 
 
 
div.infobox.norn .heading,div.infobox.norn .subheading {
 
background-color:#069!important
 
}
 
 
 
div.infobox.sylvari dd,div.infobox.sylvari dt {
 
border-color:#060!important
 
}
 
 
 
div.infobox.sylvari .heading,div.infobox.sylvari .subheading {
 
background-color:#060!important
 
}
 
 
 
div.infobox.boon dd,div.infobox.boon dt {
 
border-color:#399!important
 
}
 
 
 
div.infobox.boon .heading,div.infobox.boon .subheading {
 
background-color:#399!important
 
}
 
 
 
div.infobox.condition dd,div.infobox.condition dt {
 
border-color:#363!important
 
}
 
 
 
div.infobox.condition .heading,div.infobox.condition .subheading {
 
background-color:#363!important
 
}
 
 
 
div.infobox.armor dd,div.infobox.weapon dd,div.infobox.item dd,div.infobox.armor dt,div.infobox.weapon dt,div.infobox.item dt {
 
border-color:#c30
 
}
 
 
 
div.infobox.armor .heading,div.infobox.weapon .heading,div.infobox.item .heading,div.infobox.armor .subheading,div.infobox.weapon .subheading,div.infobox.item .subheading {
 
background:#c30
 
}
 
 
 
div.infobox.recipe {
 
width:250px;
 
display: inline-block;
 
float:none;
 
clear:none;
 
vertical-align:top;
 
font-size:1em;
 
margin:0 1em 1em 0
 
}
 
 
 
div.infobox.recipe .heading,div.infobox.recipe .subheading {
 
font-size:1.133em;
 
background:#533610
 
}
 
 
 
div.infobox.recipe .wrapper {
 
padding:0 10px
 
}
 
 
 
div.infobox.crafting .heading,div.infobox.crafting .subheading {
 
background:#533610
 
}
 
 
 
div.infobox.crafting dd,div.infobox.recipe dd,div.infobox.crafting dt,div.infobox.recipe dt {
 
border-color:#533610
 
}
 
 
 
div.infobox.npc dd,div.infobox.npc dt {
 
border-color:#390
 
}
 
 
 
div.infobox.npc .heading,div.infobox.npc .subheading {
 
background:#390
 
}
 
 
 
div.infobox.skill dd,div.infobox.trait dd,div.infobox.skill dt,div.infobox.trait dt {
 
border-color:#999
 
}
 
 
 
div.infobox.skill .heading,div.infobox.trait .heading,div.infobox.skill .subheading,div.infobox.trait .subheading {
 
background:#444
 
}
 
 
 
div.infobox.skill .icon > div {
 
border:2px solid #111
 
}
 
 
 
div.infobox.trait .icon {
 
margin:5px 7px
 
}
 
 
 
div.infobox.effect .condition {
 
background:#363
 
}
 
 
 
div.infobox.effect .boon {
 
background:#399
 
}
 
 
 
div.infobox.pet dd,div.infobox.pet dt {
 
border-color:#360
 
}
 
 
 
div.infobox.pet .heading,div.infobox.pet .subheading {
 
background:#360
 
}
 
 
 
div.infobox.quest dd,div.infobox.quest dt {
 
border-color:#f90
 
}
 
 
 
div.infobox.quest .heading,div.infobox.quest .subheading {
 
background:#f90
 
}
 
 
 
div.infobox.area dd,div.infobox.area dt {
 
border-color:#306
 
}
 
 
 
div.infobox.area .heading,div.infobox.area .subheading {
 
background:#306
 
}
 
 
 
/**NAV BARS (headings are done with infobox headings)**/
 
div.nav {
 
position:relative;
 
width:500px;
 
margin:auto
 
}
 
 
 
div.nav .box {
 
position:relative;
 
font-size:.9230769231em;
 
border-spacing:0;
 
overflow:visible;
 
min-height:60px;
 
border:1px solid #aaa;
 
margin:5px;
 
padding:0
 
}
 
 
 
div.nav .heading {
 
font-family:Arial, sans-serif!important;
 
background-color:#888;
 
font-size:1.083em;
 
line-height:100%;
 
margin:-1px -1px 0;
 
padding:.769em 0
 
}
 
 
 
div.nav .subheading {
 
font-family:Arial, sans-serif;
 
font-size:1em;
 
font-size-adjust:.52;
 
padding:.833em 0
 
}
 
 
 
div.nav dt,div.nav dd,div.infobox dt,div.infobox dd,div.nav table {
 
line-height:1.667em
 
}
 
 
 
div.nav .center {
 
text-align:center;
 
margin:10px 0
 
}
 
 
 
div.nav .box table {
 
background-color:transparent;
 
border-collapse:collapse;
 
width:100%;
 
margin:.667em 0
 
}
 
 
 
div.nav dt {
 
float:left;
 
text-align:right;
 
width:125px;
 
clear:left;
 
border-right:2px solid #999;
 
margin:0 -2px 0 0;
 
padding:2px 8px
 
}
 
 
 
div.nav dd {
 
float:left;
 
text-align:left;
 
border-left:#888 solid 2px;
 
width:325px;
 
margin:0;
 
padding:2px 8px
 
}
 
 
 
div.nav table th {
 
text-align:right;
 
border-right:2px solid #888;
 
vertical-align:top;
 
padding:2px 8px
 
}
 
 
 
div.nav table td {
 
padding:2px 8px 5px
 
}
 
 
 
div.nav table td  a{
 
white-space:nowrap;
 
}
 
 
 
div.nav.thin .box {
 
width:400px;
 
margin-left:50px
 
}
 
 
 
div.nav.thin dt {
 
width:75px
 
}
 
 
 
div.nav.thin dd {
 
width:290px
 
}
 
 
 
div.nav.wide .box {
 
width:600px;
 
margin-left:-50px
 
}
 
 
 
div.nav.wide dt {
 
width:150px
 
}
 
 
 
div.nav.wide dd {
 
width:400px
 
}
 
 
 
div.nav.npc .heading {
 
background-color:#6c3
 
}
 
 
 
div.nav.npc dd,div.nav.npc dt,div.nav.npc table th {
 
border-color:#6c3
 
}
 
 
 
div.nav.pve .heading {
 
background-color:#fc6
 
}
 
 
 
div.nav.pve dd,div.nav.pve dt,div.nav.pve table th {
 
border-color:#fc6
 
}
 
 
 
div.nav.equip .heading {
 
background-color:#f96
 
}
 
 
 
div.nav.equip dd,div.nav.equip dt,div.nav.equip table th {
 
border-color:#f96
 
}
 
 
 
div.nav.mech1 .heading {
 
background-color:#69c
 
}
 
 
 
div.nav.mech1 dd,div.nav.mech1 dt,div.nav.mech1 table th {
 
border-color:#69c
 
}
 
 
 
div.nav.mech2 .heading {
 
background-color:#3cc
 
}
 
 
 
div.nav.mech2 dd,div.nav.mech2 dt,div.nav.mech2 table th {
 
border-color:#3cc
 
}
 
 
 
div.nav.location .heading {
 
background-color:#96c
 
}
 
 
 
div.nav.location dd,div.nav.location dt,div.nav.location table th {
 
border-color:#96c
 
}
 
 
 
div.nav.lore .heading {
 
background-color:#c6c
 
}
 
 
 
div.nav.lore dd,div.nav.lore dt,div.nav.lore table th {
 
border-color:#c6c
 
}
 
 
 
div.nav.promo .heading {
 
background-color:#9c3
 
}
 
 
 
div.nav.promo dd,div.nav.promo dt,div.nav.promo table th {
 
border-color:#9c3
 
}
 
 
 
div.nav.hom .heading {
 
background-color:#c96
 
}
 
 
 
div.nav.hom dd,div.nav.hom dt,div.nav.hom table th {
 
border-color:#c96
 
}
 
 
 
div.nav.crafting .heading,div.nav.recipe .heading {
 
background-color:#963
 
}
 
 
 
div.nav.crafting dd,div.nav.hom dt,div.nav.crafting table th,div.nav.recipe dd,div.nav.hom dt,div.nav.recipe table th {
 
border-color:#963
 
}
 
 
 
div.nav.guardian .heading,div.nav.guardian .subheading {
 
background-color:#39c
 
}
 
 
 
div.nav.guardian dd,div.nav.guardian dt,div.nav.guardian table th {
 
border-color:#39c
 
}
 
 
 
div.nav.warrior .heading,div.nav.warrior .subheading {
 
background-color:#f93
 
}
 
 
 
div.nav.warrior dd,div.nav.warrior dt,div.nav.warrior table th {
 
border-color:#f93
 
}
 
 
 
div.nav.engineer .heading,div.nav.engineer .subheading {
 
background-color:#963
 
}
 
 
 
div.nav.engineer dd,div.nav.engineer dt,div.nav.engineer table th {
 
border-color:#963
 
}
 
 
 
div.nav.ranger .heading,div.nav.ranger .subheading {
 
background-color:#6c3
 
}
 
 
 
div.nav.ranger dd,div.nav.ranger dt,div.nav.ranger table th {
 
border-color:#6c3
 
}
 
 
 
div.nav.thief .heading,div.nav.thief .subheading {
 
background-color:#c66
 
}
 
 
 
div.nav.thief dd,div.nav.thief dt,div.nav.thief table th {
 
border-color:#c66
 
}
 
 
 
div.nav.elementalist .heading,div.nav.elementalist .subheading {
 
background-color:#f33
 
}
 
 
 
div.nav.elementalist dd,div.nav.elementalist dt,div.nav.elementalist table th {
 
border-color:#f33
 
}
 
 
 
div.nav.mesmer .heading,div.nav.mesmer .subheading {
 
background-color:#939
 
}
 
 
 
div.nav.mesmer dd,div.nav.mesmer dt,div.nav.mesmer table th {
 
border-color:#939
 
}
 
 
 
div.nav.necromancer .heading,div.nav.necromancer .subheading {
 
background-color:#396
 
}
 
 
 
div.nav.necromancer dd,div.nav.necromancer dt,div.nav.necromancer table th {
 
border-color:#396
 
}
 
 
 
div.nav.asura .heading,div.nav.asura .subheading {
 
background-color:#96f
 
}
 
 
 
div.nav.asura dd,div.nav.asura dt,div.nav.asura table th {
 
border-color:#96f
 
}
 
 
 
div.nav.charr .heading,div.nav.charr .subheading {
 
background-color:#f33
 
}
 
 
 
div.nav.charr dd,div.nav.charr dt,div.nav.charr table th {
 
border-color:#f33
 
}
 
 
 
div.nav.human .heading,div.nav.human .subheading {
 
background-color:#fc3
 
}
 
 
 
div.nav.human dd,div.nav.human dt,div.nav.human table th {
 
border-color:#fc3
 
}
 
 
 
div.nav.norn .heading,div.nav.norn .subheading {
 
background-color:#6cf
 
}
 
 
 
div.nav.norn dd,div.nav.norn dt,div.nav.norn table th {
 
border-color:#6cf
 
}
 
 
 
div.nav.sylvari .heading,div.nav.sylvari .subheading {
 
background-color:#3c3
 
}
 
 
 
div.nav.sylvari dd,div.nav.sylvari dt,div.nav.sylvari table th {
 
border-color:#3c3
 
}
 
 
 
/**PRINTER CHANGES**/
 
@media print {
 
#content {
 
border:0 solid #fff;
 
box-shadow:none;
 
border-radius:0
 
}
 
 
 
#mainpagenavigation th,div.infobox .heading,div.infobox .subheading,div.nav .heading,div.nav .subheading {
 
color:#000!important;
 
text-shadow:none!important;
 
border-width:0!important
 
}
 
 
 
table.table > :first-child > tr:first-child,table.table > :first-child > tr:first-child > *,.table > tbody > tr > * {border:1px solid #000!important}
 
.table {border-collapse:collapse!important}
 
}
 
 
 
/**Hiding icon redlinks**/
 
span.thumb-icon a.new {
 
  color: transparent;
 
  display: inline-block;
 
  font: 0/0 a;
 
  overflow: hidden;
 
  vertical-align: middle;
 
}
 
 
 
/* Item icons */
 
span.thumb-icon.item-icon.small a.new {
 
  background-image: url(/images/thumb/7/74/Skill.png/20px-Skill.png);
 
  height: 20px;
 
  width: 20px;
 
}
 
 
 
span.thumb-icon.item-icon.medium a.new {
 
  background-image: url(/images/thumb/7/74/Skill.png/35px-Skill.png);
 
  height: 35px;
 
  width: 35px;
 
}
 
 
 
/* Infobox icons */
 
div.infobox-icon a.new {
 
  color: transparent;
 
  display: inline-block;
 
  font: 0/0 a;
 
  overflow: hidden;
 
  vertical-align: middle;
 
  background-image: url(/images/thumb/7/74/Skill.png/40px-Skill.png);
 
  height: 40px;
 
  width: 40px;
 
}
 
 
 
div.skill-infobox-icon a.new {
 
  color: transparent;
 
  display: inline-block;
 
  font: 0/0 a;
 
  overflow: hidden;
 
  vertical-align: middle;
 
  background-image: url(/images/thumb/7/74/Skill.png/48px-Skill.png);
 
  height: 48px;
 
  width: 48px;
 
}
 
 
 
/* Skill icons */
 
/* will require more work since the template takes a continuous size parameter, rather than discrete size values */
 
 
 
*+html span.thumb-icon a.new { display: inline; } /* IE7 fix */
 
* html span.thumb-icon a.new { display: inline; } /* IE6 fix */
 
 
 
/* Inline icons */
 
div.inline-icon {
 
  display:inline-block;
 
  bottom: 2px;
 
  overflow: visible;
 
  height: 1.5384615385em;
 
  margin: 0 0.167em;
 
}
 
 
 
/* Masthead links */
 
#upperBar {
 
  position:absolute;
 
  top:0;
 
  left:156px;
 
  height:30px;
 
  z-index: 4;
 
}
 
 
 
#upperBar ul {
 
  padding:0px;
 
  margin:0px;
 
  list-style:none;
 
}
 
#upperBar ul li {
 
  margin:0;
 
  padding:0px;
 
  display:inline-block;
 
  font-family: "EasonPro","Times New Roman","serif";
 
}
 
#upperBar ul li a {
 
  color:#FFC8AD;
 
  text-transform:uppercase;
 
  font-size:12px;
 
  padding: 8px 10px;
 
  line-height:2.6;
 
}
 
#upperBar ul li a:hover {
 
  text-decoration:none;
 
  color:white;
 
}
 
#upperBar ul li:first-child a:hover {
 
  background:url(https://d2vn94glaxzkz3.cloudfront.net/wp-content/themes/guildwars2.com-live/img/nav-external.2181915747.png) no-repeat 0 -30px;
 
  background-position:-121px -30px;
 
}
 
#upperBar ul li:first-child+li a:hover {
 
  background:url(https://d2vn94glaxzkz3.cloudfront.net/wp-content/themes/guildwars2.com-live/img/nav-external.2181915747.png) no-repeat 0 -30px;
 
  background-position:-206px -30px;
 
}
 
#upperBar ul li:first-child+li+li a:hover {
 
  background:url(https://d2vn94glaxzkz3.cloudfront.net/wp-content/themes/guildwars2.com-live/img/nav-external.2181915747.png) no-repeat 0 -30px;
 
  background-position:-274px -30px;
 
}
 
 
 
/* Restore sort icons for sortable table headers
 
* These are inserted as CSS background-image, which clashes with our fancy grandient overlays
 
*/
 
 
 
table.jquery-tablesorter th.headerSort {
 
  background-image: url(data:image/gif;base64,R0lGODlhFQAJAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAxODAxMTc0MDcyMDY4MTE4OEM2REYyN0ExMDhBNDJFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdCNTAyODcwMEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdCNTAyODZGMEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDE4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDE4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAAFQAJAAACF4yPgMsJ2mJ4VDKKrd4GVz5lYPeMiVUAADs=);
 
  background-image: url(/resources/jquery/images/sort_both.gif?2012-12-04T21:08:20Z)!ie;
 
  padding: 0.5em;
 
  padding-right: 21px;
 
}
 
 
 
table.jquery-tablesorter th.headerSortDown {
 
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAyODAxMTc0MDcyMDY4MTE4OEM2REYyN0ExMDhBNDJFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjhFNzNGQjI3MEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjhFNzNGQjI2MEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDI4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDI4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAAFQAEAAACDYyPAcmtsJyDVDKKWQEAOw==);
 
  background-image: url(/resources/jquery/images/sort_down.gif?2012-12-04T21:08:20Z)!ie;
 
}
 
 
 
table.jquery-tablesorter th.headerSortUp {
 
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAzODAxMTc0MDcyMDY4MTE4OEM2REYyN0ExMDhBNDJFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdCNTAyODc0MEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdCNTAyODczMEY4NjExRTBBMzkyQzAyM0E1RDk3RDc3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDM4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDM4MDExNzQwNzIwNjgxMTg4QzZERjI3QTEwOEE0MkUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAAFQAEAAACDYwfoAvoz9qbZ9FrJC0AOw==);
 
  background-image: url(/resources/jquery/images/sort_up.gif?2012-12-04T21:08:20Z)!ie;
 
}
 
 
 
/* No clue where it comes from, but this is "justify" by default and it looks bad */
 
div.gallerytext {
 
  text-align: left;
 
}
 
 
 
/* Recipe boxes that don't look like infoboxes */
 
div.recipe-box {
 
  /* from div.infobox.recipe */
 
  min-width: 300px;
 
  display: inline-block;
 
  float: none;
 
  clear: none;
 
  vertical-align: top;
 
  font-size: 1em;
 
  margin: 0 1em 0 0;
 
 
 
  /* from div.infobox */
 
  position: relative;
 
  background: #FFF;
 
  border: 1px solid #aaa;
 
  padding: 0;
 
 
 
  /* from div.infobox, div.nav .box */
 
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffffff,EndColorStr=#ffeeeeee);
 
  background-image: linear-gradient(top,#fff 0%,#eee 100%);
 
  background-image: -o-linear-gradient(top,#fff 0%,#eee 100%);
 
  background-image: -moz-linear-gradient(top,#fff 0%,#eee 100%);
 
  background-image: -webkit-linear-gradient(top,#fff 0%,#eee 100%);
 
  background-image: -ms-linear-gradient(top,#fff 0%,#eee 100%);
 
  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#fff),color-stop(1,#eee));
 
}
 
 
 
div.recipe-box::after {
 
  /* from div.infobox:after ... */
 
  bottom: -4px;
 
  content: "";
 
  position: absolute;
 
  width: 100%;
 
  left: 0;
 
  height: 3px;
 
  background-image: url(http://wiki.guildwars2.com/images/4/45/Shadow_after.png);
 
  background-size: 100% 3px;
 
}
 
 
 
div.recipe-box .subheading, div.recipe-box .heading {
 
  text-align: center;
 
  background-color: #D3C0A8;
 
  padding: 2px;
 
  font-weight: bold;
 
  background-image:url(http://wiki.guildwars2.com/images/c/cc/Infobox_header_overlay.png)!important;
 
  border:1px solid rgba(0,0,0,0.25);
 
  margin:-1px -1px 5px!important
 
}
 
 
 
div.recipe-box .subheading {
 
  border-width:0 1px;
 
}
 
 
 
div.recipe-box dl {
 
  margin: 10px 0;
 
}
 
 
 
div.recipe-box dt {
 
  float: left;
 
  text-align: right;
 
  width: 78px;
 
  line-height: 1em;
 
  font-weight: 700;
 
  clear: left;
 
  border-right: 2px solid #A99A86;
 
  margin: 0 -2px 0 0;
 
  padding: 2px 8px 2px 3px;
 
  line-height: 1.667em;
 
}
 
 
 
div.recipe-box dd {
 
  float: left;
 
  border-left: 2px solid #999;
 
  margin: 0;
 
  padding: 2px 7px;
 
}
 
 
 
/* For generic ingredient lists anywhere on the wiki */
 
div.ingredients dt {
 
  float: left;
 
  clear: left;
 
  text-align: right;
 
  font-weight: normal;
 
  width: 25px; 
 
  margin: 0 -2px 0 0;
 
  padding: 2px 2px 2px 3px;
 
  line-height: 1.667em;
 
  border: none;
 
}
 
 
div.ingredients dd {
 
  float: left;
 
  margin: 0;
 
  padding: 2px 7px;
 
  border: none;
 
}
 
 
div.ingredients dl {
 
  margin: 2px 0;
 
}
 
 
 
/* jqplot data labels; make them more readable */
 
.jqplot-data-label { color: white; text-shadow: 1px 1px black; }
 
 
 
 
 
/* GW2W Chat link search (for MediaWiki:ChatLinkSearch.js) */
 
.gw2w-chat-link-search {
 
    background: #F3F3F3;
 
    border: 1px solid #C0C0C0;
 
    margin: 1em 0;
 
    padding: .5em;
 
 
}
 
}
.gw2w-chat-link-search tt {
+
@media only screen and (max-width: 800px) {
     font-size: 10px;
+
    /* Decouple the columns on narrow screens */
     margin-right: 1em;
+
    .portal-column-left,
 +
    .portal-column-right,
 +
    .portal-column-left-wide,
 +
    .portal-column-right-narrow,
 +
     .portal-column-left-extra-wide,
 +
     .portal-column-right-extra-narrow {
 +
        float: inherit;
 +
        width: inherit;
 +
    }
 
}
 
}

於 2018年7月4日 (三) 23:07 的最新修訂

/* 此處的 CSS 將應用於所有的面板

/* fix google maps little man in responsive skin (20160822 Rocio) */
.gm-style img {
    max-width: none;
}
<meta name="viewport" content="width=device-width; initial-scale=1.0" /> */

/*全部的使用者都會載入這裡的 CSS。*/
@media screen and (min-width: 1200px) {
    // 如果使用者之視窗寬度 >= 1200px,將會再載入這裡的 CSS。
}

@media screen and (min-width: 768px) and (max-width: 979px) {
    // 如果使用者之視窗寬度介於 768px ~ 979px,將會再載入這裡的 CSS。    
}

@media screen and (max-width: 767px) {
    // 如果使用者之視窗寬度 <= 768px,將會再載入這裡的 CSS。    
}

@media screen and (max-device-width: 480px) {

}

body.page-Main_Page h1.firstHeading { display: none; }

#scrollDiv{width:100%;height:25px;line-height:25px; overflow:hidden}      
#scrollDiv li{height:25px;padding-left:10px;list-style:none;}

/* new home screen */
#hs{
	position: relative;
	overflow: auto;
	color:#333;
}
#hs-banner{
	height: 200px;
	overflow: auto;
	position: relative;
}
#hs-banner img {
	position: absolute;
	width: 100%;
        height: auto;
	bottom: -60%;
}
#hs-banner-intro {
    background: none;
    margin: 140px 0 0 3px;
    opacity: 0.8;
    padding: 15px;
    position: relative;
    width: 500px;
    z-index: 1;
    font-size: 110%;
}
#hs-banner-intro h1{
font-family:微軟正黑體, sans-serif;
	border: 0;
	margin-bottom: 0;
}
<!--以下為R設定-->
#hs-bannerR {
	height: 250px;
	overflow: hidden;
	position: relative;
        border-radius: 10px;
}
#hs-bannerR img {
	position: absolute;
	width: 100%;
        height: auto;
	bottom: -60%;
        opacity: 0.7; //透明度
}
#hs-banner-introR {
    border: 1;
    background: none;
    margin: 200px 0 0 20px;
    opacity: 0.8;
    padding: 15px;
    position: relative;
    width: 500px;
    z-index: 1;
    font-size: 120%;
}
#hs-banner-introR h1{
font-family:標楷體, DFKai-sb, sans-serif;
	border: 0;
	margin-bottom: 0;
}
#hs-searchR{
    border: 1;
    background: #FFFFFF;
    margin: 50px 0px 0 0;
    opacity: 0.8; //透明度
    padding: 5px;
    position: relative;
    top:-20px;
    left:40px;
    z-index: 1;
    float: right;
    font-size: 110%;
}
<!--以上為R設定-->
#hs-banner-intro p{
}

#hs-search{
 background: #FFFFFF;
    margin: 50px 0px 0 0;
opacity: 0.8;
    padding: 5px;
    position: relative;

    z-index: 1;
    float: right;
    font-size: 110%;
}
#hs-search-back{
	width: 100%;
	height: 40px;
	position: absolute;
	top:0;
	left: 0;
	opacity: 0.8;
	background: #FFF;
	
}
#hs-search input{
	position: relative;
	color:#333;
	font-size: 14px
	

}
#hs-search #bodySearchInput,
#hs-search .searchboxInput {
	width: 220px;
	background: #FFF;
	border:1px solid #B4B4B4;
	padding: 4px;
}
#hs-search .bodySearchBtnGo,
#hs-search .searchboxSearchButton{
	width: 80px;
	margin-left: 10px;
	text-transform: uppercase;
	background: #CCC;
	border:1px solid #B4B4B4;
	border-bottom:2px solid #B4B4B4;
	border-right: 2px solid #B4B4B4;
	-moz-border-radius: 2px;
border-radius: 2px;
padding: 4px 4px 3px;

}
#hs .column1{
	float: left;
	width: 49%;
	margin-right: 1%;
}
#hs .column2{
	float: left;
	width: 50%;
}
#hs .column h2, #hs .column h3{
	margin-bottom: 5px;
	margin-top: 15px;
}
#hs .half{
	width: 50%;
	float: left;
}
#hs .last{
 margin-right:0;
}
#hs .right{
float:left;
}
#hs .first{
 clear:left;
}
/*借我(Vanya)做首頁*/

#sample{
width:749px;
height:287px;
background:url(http://tamsui.dils.tku.edu.tw/wiki/images/b/b8/%E6%B7%A1%E6%B0%B4TAMSUI.jpg)
no-repeat; /*讓ie6能有固定在#sample的效果*/
}
/*下拉*/
#pmenu, #pmenu ul {
    margin: 0;
    padding: 0;
    text-decoration: none;
    list-style: none;
}
#pmenu {
    margin:25px 0 200px 15px;
}
#pmenu li {
    float:left;
    position:relative;
}
#pmenu a, #pmenu a:visited {
    display:block;
    width:100px; 
    font-size:13px; 
    color:#000;
    height:30px; 
    line-height:29px; 
    text-decoration:none; 
    text-indent:10px; 
    background:#b2ab9b; 
    border:1px solid #fff;
    border-width:0 1px 1px 0;
}
#pmenu li:hover > a{
    background:#dfd7ca;
    color:#c00;
}
#pmenu li ul {
    display: none;

}
#pmenu li:hover > ul {
    display:block;
    position:absolute;
    top:0;
    left:101px;
}
#pmenu > li:hover > ul {
    left:0;
    top:31px;
}
/*另一個下拉*/
#menuv ul{
    margin: 0;
    padding: 0;
    font-size: 13px;
    text-decoration: none;   
    list-style: none;
}
#menuv{
text-decoration: none;    
list-style: none;
}
#menuv li {
    position: relative;
    float: left;
}
/* 選單 li 裡面連結之樣式 */
#menuv li a{
    display: block;
    padding: 12px 20px;
    background: #888;
    color: #FFF;
}
/* 特定在第一層,以左邊灰線分隔 */
#menuv li > a{
    border-bottom: 1px solid #CCC;    
    border-left: 1px solid #CCC;
}
#menuv li > a:hover{
    color: #666;
    background: #DDD
}
/* 特定在第一層 > 第二層之後下拉部分之樣式 */
#menuv li ul{
    display: none;
    float: left;
    position: absolute;
    left: 0;    
    margin: 0;
}
/* 當第一層選單被觸發時,指定第二層顯示 */
#menuv li:hover > ul{
    display: block;
}
/* 特定在第二層或之後下拉部分 li 之樣式 */
#menuv ul li {
    border-bottom: 1px solid #DDD;
}
/* 特定在第二層或之後下拉部分 li (最後一項不要底線)之樣式 */
#menuv ul li:last-child {
    border-bottom: none;
}
/* 第二層或之後 選單 li 之樣式 */
#menuv ul a {
    width: 120px;
    padding: 10px 12px;    
    color: #666;        
    background: #EEE;
}
#menuv ul a:hover {        
    background: #CCC;    
}
/* 第三層之後,上一層的選單觸發則顯示出來(皆為橫向拓展) */
#menuv ul li:hover > ul{
    display: block;
    position: absolute;
    top: 0;    
    left: 100%;
}

/* END OF NEW home screen */

/* Standard Navigationsleisten.*/
 
div.Boxmerge,
div.NavFrame {
        margin: 0px;
        padding: 2px;
        border: 1px solid #aaaaaa;
        border-collapse: collapse;
        font-size: 95%;
}
div.Boxmerge div.NavFrame {
        border-style: none;
        border-style: hidden;
}
div.NavFrame + div.NavFrame,
div.NavFrame + table.collapsible,
table.collapsible + div.NavFrame,
table.collapsible + table.collapsible {
        border-top-style: none;
        border-top-style: hidden;
}
div.NavPic {
        background-color: #ffffff;
        margin: 0px;
        padding: 2px;
        float: left;
}
div.NavFrame div.NavHead {
        min-height: 1.6em;
        font-weight: bold;
        font-size: 100%;
        text-align: center;
        background-color: #efefef;
        cursor:pointer;
}
div.NavFrame p {
        font-size: 100%;
}
div.NavFrame div.NavContent {
        font-size: 100%;
}
div.NavFrame div.NavContent p {
        font-size: 100%;
}
div.NavEnd {
        margin: 0px;
        padding: 0px;
        line-height: 1px;
        clear: both;
}
/* 箭頭向下 */
div.arrow-bottom {
    display: inline-block;
    margin-left: 5px;
    border-top: 4px solid #FFF;
    border-right: 4px solid transparent;    
    border-left: 4px solid transparent;        
    width: 1px;
    height: 1px;
}
/* 箭頭向右 */
div.arrow-right {
    display: inline-block;
    margin-left: 12px;    
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-left: 3px solid #666;        
    width: 1px;
    height: 1px;
}
span.NavToggle {
        float: right;
        /*保证在禁用JS状态下不显示提示,使用hidden以保证在navbox标题能占有宽度*/
        visibility: hidden;
        text-align: right;
        font-weight: normal;
        font-size: 80%;
}
 
/* Hatnotes and disambiguation notices */
.rellink /*,
.dablink */ {
    /* font-style: italic; */
    /* @noflip */
    padding-left: 1.6em;
    margin-bottom: 0.5em;
}
.rellink i /*,
.dablink i */ {
    font-style: normal;
}

/*2014年5月12日Vanya測試用*/
/* Align */
.valign-middle, .valign-center, .va-m, .va-c { vertical-align: middle; }
.valign-top, .va-t { vertical-align: top; }
.valign-bottom, .va-b { vertical-align: bottom; }
.alignt-middle, .alignt-center, .at-m, .at-c, .eplist { text-align: center; }
.alignt-left, .at-l { text-align: left; }
.alignt-right, .at-r, .collapseButton { text-align: right; }
.align-middle, .align-center, .a-m, .a-c, .eplist { margin: 0 auto; }
.align-left, .a-l { float: left; }
.align-right, .a-r, .collapseButton, .userbox, .babelbox { float: right; }
/* 圓角邊框 */
.roundy { border-radius: 10px; }
.roundytl { border-top-left-radius: 10px; }
.roundytr { border-top-right-radius: 10px; }
.roundybl { border-bottom-left-radius: 10px; }
.roundybr { border-bottom-right-radius: 10px; }
.roundytop { border-top-left-radius: 10px; border-top-right-radius: 10px; }
.roundyright { border-bottom-right-radius: 10px; border-top-right-radius: 10px; }
.roundybottom { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
.roundyleft { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
.roundy-10 { border-radius: 10px; }
.roundytl-10 { border-top-left-radius: 10px; }
.roundytr-10 { border-top-right-radius: 10px; }
.roundybl-10 { border-bottom-left-radius: 10px; }
.roundybr-10 { border-bottom-right-radius: 10px; }
.roundytop-10 { border-top-left-radius: 10px; border-top-right-radius: 10px; }
.roundyright-10 { border-bottom-right-radius: 10px; border-top-right-radius: 10px; }
.roundybottom-10 { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
.roundyleft-10 { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
.roundy-4 { border-radius: 4px; }
.roundytl-4 { border-top-left-radius: 4px; }
.roundytr-4 { border-top-right-radius: 4px; }
.roundybl-4 { border-bottom-left-radius: 4px; }
.roundybr-4 { border-bottom-right-radius: 4px; }
.roundytop-4 { border-top-left-radius: 4px; border-top-right-radius: 4px; }
.roundyright-4 { border-bottom-right-radius: 4px; border-top-right-radius: 4px; }
.roundybottom-4 { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; }
.roundyleft-4 { border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
.roundy-5 { border-radius: 5px; }
.roundytl-5 { border-top-left-radius: 5px; }
.roundytr-5 { border-top-right-radius: 5px; }
.roundybl-5 { border-bottom-left-radius: 5px; }
.roundybr-5 { border-bottom-right-radius: 5px; }
.roundytop-5 { border-top-left-radius: 5px; border-top-right-radius: 5px; }
.roundyright-5 { border-bottom-right-radius: 5px; border-top-right-radius: 5px; }
.roundybottom-5 { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }
.roundyleft-5 { border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
.roundy-6 { border-radius: 6px; }
.roundytl-6 { border-top-left-radius: 6px; }
.roundytr-6 { border-top-right-radius: 6px; }
.roundybl-6 { border-bottom-left-radius: 6px; }
.roundybr-6 { border-bottom-right-radius: 6px; }
.roundytop-6 { border-top-left-radius: 6px; border-top-right-radius: 6px; }
.roundyright-6 { border-bottom-right-radius: 6px; border-top-right-radius: 6px; }
.roundybottom-6 { border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; }
.roundyleft-6 { border-top-left-radius: 6px; border-bottom-left-radius: 6px; }
.roundy-8 { border-radius: 8px; }
.roundytl-8 { border-top-left-radius: 8px; }
.roundytr-8 { border-top-right-radius: 8px; }
.roundybl-8 { border-bottom-left-radius: 8px; }
.roundybr-8 { border-bottom-right-radius: 8px; }
.roundytop-8 { border-top-left-radius: 8px; border-top-right-radius: 8px; }
.roundyright-8 { border-bottom-right-radius: 8px; border-top-right-radius: 8px; }
.roundybottom-8 { border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; }
.roundyleft-8 { border-top-left-radius: 8px; border-bottom-left-radius: 8px; }
.roundy-15 { border-radius: 15px; }
.roundytl-15 { border-top-left-radius: 15px; }
.roundytr-15 { border-top-right-radius: 15px; }
.roundybl-15 { border-bottom-left-radius: 15px; }
.roundybr-15 { border-bottom-right-radius: 15px; }
.roundytop-15 { border-top-left-radius: 15px; border-top-right-radius: 15px; }
.roundyright-15 { border-bottom-right-radius: 15px; border-top-right-radius: 15px; }
.roundybottom-15 { border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; }
.roundyleft-15 { border-top-left-radius: 15px; border-bottom-left-radius: 15px; }
.roundy-20 { border-radius: 20px; }
.roundytl-20 { border-top-left-radius: 20px; }
.roundytr-20 { border-top-right-radius: 20px; }
.roundybl-20 { border-bottom-left-radius: 20px; }
.roundybr-20 { border-bottom-right-radius: 20px; }
.roundytop-20 { border-top-left-radius: 20px; border-top-right-radius: 20px; }
.roundyright-20 { border-bottom-right-radius: 20px; border-top-right-radius: 20px; }
.roundybottom-20 { border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; }
.roundyleft-20 { border-top-left-radius: 20px; border-bottom-left-radius: 20px; }
.roundy-24 { border-radius: 24px; }
.roundytl-24 { border-top-left-radius: 24px; }
.roundytr-24 { border-top-right-radius: 24px; }
.roundybl-24 { border-bottom-left-radius: 24px; }
.roundybr-24 { border-bottom-right-radius: 24px; }
.roundytop-24 { border-top-left-radius: 24px; border-top-right-radius: 24px; }
.roundyright-24 { border-bottom-right-radius: 24px; border-top-right-radius: 24px; }
.roundybottom-24 { border-bottom-left-radius: 24px; border-bottom-right-radius: 24px; }
.roundyleft-24 { border-top-left-radius: 24px; border-bottom-left-radius: 24px; }
.roundy-25 { border-radius: 25px; }
.roundytl-25 { border-top-left-radius: 25px; }
.roundytr-25 { border-top-right-radius: 25px; }
.roundybl-25 { border-bottom-left-radius: 25px; }
.roundybr-25 { border-bottom-right-radius: 25px; }
.roundytop-25 { border-top-left-radius: 25px; border-top-right-radius: 25px; }
.roundyright-25 { border-bottom-right-radius: 25px; border-top-right-radius: 25px; }
.roundybottom-25 { border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; }
.roundyleft-25 { border-top-left-radius: 25px; border-bottom-left-radius: 25px; }
.roundy-30 { border-radius: 30px; }
.roundytl-30 { border-top-left-radius: 30px; }
.roundytr-30 { border-top-right-radius: 30px; }
.roundybl-30 { border-bottom-left-radius: 30px; }
.roundybr-30 { border-bottom-right-radius: 30px; }
.roundytop-30 { border-top-left-radius: 30px; border-top-right-radius: 30px; }
.roundyright-30 { border-bottom-right-radius: 30px; border-top-right-radius: 30px; }
.roundybottom-30 { border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; }
.roundyleft-30 { border-top-left-radius: 30px; border-bottom-left-radius: 30px; }
.roundy-32 { border-radius: 32px; }
.roundytl-32 { border-top-left-radius: 32px; }
.roundytr-32 { border-top-right-radius: 32px; }
.roundybl-32 { border-bottom-left-radius: 32px; }
.roundybr-32 { border-bottom-right-radius: 32px; }
.roundytop-32 { border-top-left-radius: 32px; border-top-right-radius: 32px; }
.roundyright-32 { border-bottom-right-radius: 32px; border-top-right-radius: 32px; }
.roundybottom-32 { border-bottom-left-radius: 32px; border-bottom-right-radius: 32px; }
.roundyleft-32 { border-top-left-radius: 32px; border-bottom-left-radius: 32px; }
.roundy-48 { border-radius: 48px; }
.roundytl-48 { border-top-left-radius: 48px; }
.roundytr-48 { border-top-right-radius: 48px; }
.roundybl-48 { border-bottom-left-radius: 48px; }
.roundybr-48 { border-bottom-right-radius: 48px; }
.roundytop-48 { border-top-left-radius: 48px; border-top-right-radius: 48px; }
.roundyright-48 { border-bottom-right-radius: 48px; border-top-right-radius: 48px; }
.roundybottom-48 { border-bottom-left-radius: 48px; border-bottom-right-radius: 48px; }
.roundyleft-48 { border-top-left-radius: 48px; border-bottom-left-radius: 48px; }
.roundy-50 { border-radius: 50px; }
.roundytl-50 { border-top-left-radius: 50px; }
.roundytr-50 { border-top-right-radius: 50px; }
.roundybl-50 { border-bottom-left-radius: 50px; }
.roundybr-50 { border-bottom-right-radius: 50px; }
.roundytop-50 { border-top-left-radius: 50px; border-top-right-radius: 50px; }
.roundyright-50 { border-bottom-right-radius: 50px; border-top-right-radius: 50px; }
.roundybottom-50 { border-bottom-left-radius: 50px; border-bottom-right-radius: 50px; }
.roundyleft-50 { border-top-left-radius: 50px; border-bottom-left-radius: 50px; }
.roundy-60 { border-radius: 60px; }
.roundytl-60 { border-top-left-radius: 60px; }
.roundytr-60 { border-top-right-radius: 60px; }
.roundybl-60 { border-bottom-left-radius: 60px; }
.roundybr-60 { border-bottom-right-radius: 60px; }
.roundytop-60 { border-top-left-radius: 60px; border-top-right-radius: 60px; }
.roundyright-60 { border-bottom-right-radius: 60px; border-top-right-radius: 60px; }
.roundybottom-60 { border-bottom-left-radius: 60px; border-bottom-right-radius: 60px; }
.roundyleft-60 { border-top-left-radius: 60px; border-bottom-left-radius: 60px; }
.roundy-80 { border-radius: 80px; }
.roundytl-80 { border-top-left-radius: 80px; }
.roundytr-80 { border-top-right-radius: 80px; }
.roundybl-80 { border-bottom-left-radius: 80px; }
.roundybr-80 { border-bottom-right-radius: 80px; }
.roundytop-80 { border-top-left-radius: 80px; border-top-right-radius: 80px; }
.roundyright-80 { border-bottom-right-radius: 80px; border-top-right-radius: 80px; }
.roundybottom-80 { border-bottom-left-radius: 80px; border-bottom-right-radius: 80px; }
.roundyleft-80 { border-top-left-radius: 80px; border-bottom-left-radius: 80px; }
.roundy-96 { border-radius: 96px; }
.roundytl-96 { border-top-left-radius: 96px; }
.roundytr-96 { border-top-right-radius: 96px; }
.roundybl-96 { border-bottom-left-radius: 96px; }
.roundybr-96 { border-bottom-right-radius: 96px; }
.roundytop-96 { border-top-left-radius: 96px; border-top-right-radius: 96px; }
.roundyright-96 { border-bottom-right-radius: 96px; border-top-right-radius: 96px; }
.roundybottom-96 { border-bottom-left-radius: 96px; border-bottom-right-radius: 96px; }
.roundyleft-96 { border-top-left-radius: 96px; border-bottom-left-radius: 96px; }
.roundy-100 { border-radius: 100px; }
.roundytl-100 { border-top-left-radius: 100px; }
.roundytr-100 { border-top-right-radius: 100px; }
.roundybl-100 { border-bottom-left-radius: 100px; }
.roundybr-100 { border-bottom-right-radius: 100px; }
.roundytop-100 { border-top-left-radius: 100px; border-top-right-radius: 100px; }
.roundyright-100 { border-bottom-right-radius: 100px; border-top-right-radius: 100px; }
.roundybottom-100 { border-bottom-left-radius: 100px; border-bottom-right-radius: 100px; }
.roundyleft-100 { border-top-left-radius: 100px; border-bottom-left-radius: 100px; }
/* 圆角表格样式 */
.eplist tr:last-child td:first-child { border-bottom-left-radius: 6px; }
.eplist tr:last-child td:last-child { border-bottom-right-radius: 6px; }

/* ***** ***** TimelineTable ***** ***** */
table.tl_table{
        border-width: thin;
        border-spacing: 2px;
        border-style: outset;
        border-color: black;
        border-collapse: separate;
        background-color: white;
        border-radius: 9px;
}
 
th.tl_title{
        text-transform: uppercase
        text-align: center;
        border-width: 1px;
        padding: 1px;
        border-style: outset;
        border-color: blue;
        background-color: rgb(243, 248, 252);
        border-radius: 9px;
}
 
th.tl_years{
        text-align: center;
        font-style: italic;
        border-width: 1px;
        padding: 1px;
        border-style: outset;
        border-color: blue;
        background-color: rgb(223, 228, 252);
        border-radius: 4px;
}
 
th.tl_months{
        text-align: center;
        border-width: 1px;
        padding: 1px;
        border-style: outset;
        border-color: blue;
        background-color: rgb(243, 248, 252);
        border-radius: 2px;
}
 
th.tl_days{
        text-align: center;
        border-width: 1px;
        padding: 1px;
        border-style: outset;
        border-color: blue;
        background-color: rgb(243, 248, 252);
        border-radius: 2px;
}
 
th.tl_weeks{
        text-align: center;
        border-width: 1px;
        padding: 1px;
        border-style: outset;
        border-color: blue;
        background-color: rgb(243, 248, 252);
        border-radius: 2px;
}
 
td.tl_freetime{
        background-color: rgb(187, 210, 236);
        border-width: 1px;
        border-color: black;
        border-style: inset;
        border-radius: 7px;
}
 
td.tl_event{
        text-align: center;
        padding: 1px;
        background-color: rgb(61, 114, 194);
        border-width: 1px;
        border-color: white;
        border-style: inset;
        color: white;
        border-radius: 7px;
        white-space: normal
}
 
td.tl_foot{
        text-align: center;
        padding: 1px;
        background-color: rgb(243, 248, 252);
        border-width: 1px;
        border-color: blue;
        border-style: ridge;
        color: gray;
        border-radius: 9px;
}
 
thead.tl_header{}
tbody.tl_body{}
tfoot.tl_footer{}

/* == 浮動目錄與透明度 == Add by Rocio 20150119
#toc, .toc {
        display: block;
        position: fixed;
        top: 100px;
        right: 0px;
        min-width: 200px;
        max-width: 350px;
        max-height: 600px;
        overflow-y: scroll;
        border: 1px solid #aaa;
        border-radius: 0 0 1px 1px;
        -moz-border-radius: 0 0 1px 1px;
        background: rgba(249,249,249,0.7);
        padding: 12px;
        box-shadow: 0 1px 8px #000;
        -webkit-box-shadow: 0 1px 8px #000;
        -moz-box-shadow: 0 1px 8px #000;
}*/
#toc, .toc {
        background: rgba(249,249,249,0.7);
        padding: 10px;
}
/* 測試card 20150730 */
.interesting_cards .cards {
    text-align: center;
}
.card {
    background-color: white;
    padding: 0;
    display: inline-block;
    margin-right: .5em;
    margin-left: .5em;
    margin-top: 1em;
    border: 1px solid #d8d8d8;
    border-bottom: 3px solid #d5d5d5;
    text-align: center;
    overflow: hidden;
    width: 200px;
}
.card .info {
    overflow: hidden;
    border-top: 1px solid #dfdfdf;
    width: 200px;
    height: 2.4em;
    display: block;
}
.card .info .title {
    font-size: 80%;
    display: block;
    padding: .5em 1em .5em 1em;
    font-weight: bold;
}

/* 測試手機版界面的設定 2016-10-18 (先寫進來,有空再來測試)
   For portals, added 2011-12-07 -bv
   On wide screens, show these as two columns
   On narrow and mobile screens, let them collapse into a single column */
.portal-column-left {
    float: left;
    width: 50%;
}
.portal-column-right {
    float: right;
    width: 49%;
}
.portal-column-left-wide {
    float: left;
    width: 60%;
}
.portal-column-right-narrow {
    float: right;
    width: 39%;
}
.portal-column-left-extra-wide {
    float: left;
    width: 70%;
}
.portal-column-right-extra-narrow {
    float: right;
    width: 29%;
}
@media only screen and (max-width: 800px) {
    /* Decouple the columns on narrow screens */
    .portal-column-left,
    .portal-column-right,
    .portal-column-left-wide,
    .portal-column-right-narrow,
    .portal-column-left-extra-wide,
    .portal-column-right-extra-narrow {
        float: inherit;
        width: inherit;
    }
}