Theme Magazine

+ 显示源代码

/*
=====================================
杂志主题 - sigma9
 
by Etinjat
 
tab 代码来源于 MalyceGraves 的报纸版式
半月刊特供代码部分由 hoah2333 制作
侧栏标志由 Kcorena 绘制
=====================================
*/
 
/*------------------- 引入 -------------------*/
 
@import url(https://etinjat.wikidot.com/typeface:magazine-theme/code/3);
 
@import url('https://fonts.googleapis.com/css2?family=Zhi+Mang+Xing&display=swap');
 
/*
=====================================
根属性
=====================================
*/
 
:root{
 
/* ----------- 页面 ----------- */
 
--content-width:inherit;
--main-width:inherit;
 
/* ----------- 标题 ----------- */
 
--header-title: " \00A0 Tổ Chức SCP" ;
--header-subtitle:"Quản Thúc, Lưu Trữ, Bảo Vệ";
--pad-title: var(--header-title) ;
--pad-subtitle: var(--header-subtitle) ;
--mob-title:var(--pad-title);
--mob-subtitle: var(--pad-subtitle) ;
 
--sidebar-content:'Tài Liệu Tổ Chức';
 
/* ----------- 字体 ----------- */
 
--page-font:'Noto Sans SC', '微软雅黑', '等线';
--page-tt-font:'Noto Serif SC';
--mob-tt-font:'Noto Serif SC', serif !important;   
--header-tt-font:Huiwen-mincho,  'Noto Serif SC';
--handwriting-font: 'Zhi Mang Xing', sans-serif;
--teletype-font: '仿宋', var(--teletype222-font), 'Andale Mono', 'Courier New',var(--page-font) , Courier, monospace;
--teletype222-font: 'Noto Serif SC';
 
--header-tt-font-weight:500;
--header-h2-font-weight:600;
 
/* ----------- 颜色 ----------- */
 
--dark-accent:rgb(110, 100, 105);
--page-bg:var(--color-grey);
--accentColor:#542429;
 
--color-red:#990314;
--color-grey:#ecebf0;
--color-grey-dark:#e0e1e1;
--color-grey-darker:#d2d2d2;
--color-grey-darkest:#c4c4c4;
--swatch-primary-darker:egb(64,96,22);
 
--color-kraft:rgb(185,137,102);
--color-navy:rgb(20,21,39);
--color-blue:#2c477d;
--color-paleblue:#4e5166;
--color-gold:#c39c52;
--color-brown:#ead1b3;
 
--color-light:#e8e8e8;
--color-darkest:#000;
--color-darker:#333;
--color-dark:#555;  
 
/* ------------ 版头 ------------------  */
 
   /* 版头 和 标题 */
 --header-bg:var(--color-kraft);
 --topbar-bg:var(--color-navy);
 --topbar-txt: var(--color-gold);
 
 --header-mob-hover:var(--color-red);
 
 --header-tt-color:var(--accentColor);
 --header-subtt-color:var(--color-darkest);
 
--hdtt-top:inherit;
--hdtt-subtop:0.4rem;
 
 --hdtt-top-pad:var(--hdtt-top);
 --hdtt-subtop-pad:var(--hdtt-subtop);
 
 --hdtt-top-mob:5px;
 --hdtt-subtop-mob:0rem;
 
    /*   搜索栏    */
     --search-line:var(--accentColor);
     --search-bg:transparent;
     --search-bg-hover:var(--search-line);
     --search-txt:var(--search-line);
     --search-txt-hover:var(--header-bg);
 
    /*   用户栏   */
       --user-line:var(--header-tt-color);
       --user-unline:var(--header-subtt-color);
       --user-list-txtHVR:var(--color-gold);
       --headbtn-line-hover:var(--header-mob-hover);
 
    /* 侧栏色 */
   --barColour: var(--color-grey);
 
     /* tab色 */
    --color-tabsect-bg222:var(--color-brown);
    --color-tabsect-txt222:var(--color-red);
 
/* ----------- 标志 ----------- */
    --logo-size:110px;
    --logo-top:11px;
    --logo-opacity:0.2;
    --logo-position:50.2% 0%;
 
    --logo-top-mob:15px;
    --logo-size-mob:120px;
    --logo-position-mob:47.8% 0%;
 
   --header-cover:url(https://scpsandboxcn.wikidot.com/local--files/image/IMG-noise-point.png);
 
   --logo-image:url(https://o5command-int.wdfiles.com/local--files/tech-team:graphic-templates/scp-logo.svg);
   --logo-image-mob:var(--logo-image);
   --logo-sidebar:url('http://semimonth.wikidot.com/local--files/main/LOGO-semi-001.svg');
   --logo-sidebar-mob:var(--logo-sidebar);
 
   --logo-sidebar-opacity:1;
 
/* ------------------- 页面标题 ------------------- */
 
  /****************************
    --page-tt-txtPOS: center;
    --page-tt-btmPADD: 0.5rem;
    --page-tt-txt: var(--color-gold);
    --page-tt-bg: var(--topbar-bg);
    --page-tt-top: var(--accentColor);
    --page-tt-margin:0;
 ********************************/
 
    --page-tt-txtPOS: center;
 
    --page-tt-txt: #000;
    --page-tt-bg: transparent;
    --page-tt-top: transparent;  
    --page-tt-bottom: #444;
    --pgtt-before-contentBG:var(--page-bg);  
    --pgtt-before-contentTXT: var(--accentColor);
 
     --page-tt-size: 2.5rem;
     --page-tt-sizeMOB:1.8rem;
 
    /* 标题边距 */
     /***********************
    --page-tt-height:calc(var(--page-tt-size) + var(--page-tt-size) / 3.5);
    --page-tt-heightMOB:calc(var(--page-tt-sizeMOB) + var(--page-tt-sizeMOB) / 3.5);
    --page-tt-padding:calc(var(--page-tt-size) / 3);
    --pgtt-margin-top: 0.5rem;
 
     ************************/
 
    --page-tt-heightMOB:calc(var(--page-tt-sizeMOB) + var(--page-tt-sizeMOB) / 3.5);
    --ssss:calc(var(--page-tt-sizeMOB) / 3);
    --page-ttMOB-padding: var(--ssss);
 
    /* 底部装饰物 */
    --pgtt-before-content:'\f005  ';     
    --pgtt-before-width:calc(var(--page-tt-size) / 5 * 6);
    --pgtt-before-size: calc(var(--page-tt-size) / 5 * 4);
    --pgtt-before-height:inherit;
    --pgtt-before-widthMOB:calc(var(--page-tt-sizeMOB) / 5 * 6);
    --pgtt-before-heightMOB:var(--pgtt-before-sizeMOB);  
    --pgtt-before-sizeMOB: calc(var(--page-tt-sizeMOB) / 5 * 4);
 
    /* 底部较短的装饰线 */
    --pgett-after-width:80%;
    --pgtt-after-height:0rem;
   /* --pgett-after-left:calc((100% - var(--pgett-after-width)) / 2);*/
    --pgtt-before-left:calc(50% - var(--pgtt-before-width) / 2);
    --page-content-top:var(--pgtt-before-height);
 
     /* 底部装饰边距 */
 
    --pgtt-before-bottom:calc(0rem - var(--page-tt-size) / 1.5 + 0.2rem);
    --pgtt-after-top:calc(var(--pgtt-before-width) / 4 + 0.5rem);
 
    --pgtt-before-bottomMOB:-1rem;
    --pgtt-after-topMOB:calc(var(--pgtt-before-sizeMOB) / 4 * 3.5);
 
    --pgtt-margin-top:0.2rem;
    --page-tt-topPADD: 1rem;
    --page-tt-btmPADD: 0.5rem;
    --page-tt-topBorder:0.2rem;
    --page-tt-btm:2rem; /* calc(var(--pgtt-before-size) / 4 * 5 ) */
    --page-tt-margin: var(--pgtt-margin-top) 0 var(--page-tt-btm) 0rem;
 
/* ------------------- 评分栏 ------------------- */
 
    /* 颜色 */
 
    --rate-font:var(--page-font);
    --rate-num-bg:var(--rate-num-border);
    --rate-num-num:var(--color-light);
    --rate-num-txt:var(--color-darkest);
    --rate-num-border:var(--color-darker);
 
    --rate-hover-bg:var(--color-grey-darkest);
    --rate-hover-txt:var(--color-red);
 
   --rate-btn-bgcolor:var(--page-bg);
   --rate-boder-flag:var(--color-darker);
 
    --rate-info-btn:var(--color-dark);
    --rate-info-btnHover:var(--color-darker);
    --rate-info-btnHover-txt:var(--color-light);
    --rate-info-border:var(--color-grey-darkest);
 
    --rate-mobox-border:var(--color-navy);
    --rate-mobox-bg:var(--color-kraft);
    --rate-mobox-tt:var(--color-gold);
    --rate-mobox-txt:var(--color-darkest);
    --rate-mobox-btn: var(--accentColor) ;
 
/* 尺寸 */
    --rate-num-size:1.2rem;
    --rate-num-padding:calc(var(--rate-num-size) / 3);
 
    --rate-padding-top:1rem;
    --rate-padding-left:0.1rem;
 
    --rate-btn-size:1rem;
    --rate-btn-width:1.6rem;
    --rate-btn-height:1.5rem;
    --rate-btn-mgleft:0.5rem;
 
    /*
    --rate-flag-left:0.2rem;
    */
    --rate-flag-underTOP:0.2rem;
 
     --rate-flag-top:calc(var(--rate-num-size) - var(--rate-padding-top) + 0.15rem);
    --rate-flag-topHover:calc(var(--rate-num-size) + var(--rate-padding-top)  + var(--rate-btn-height) / 2 - var(--rate-line-gap) );
 
    --rate-delta-half:calc(var(--rate-btn-width) / 2);
    --rate-delta-height:calc(var(--rate-btn-width) / 4);
    --rate-delta-size:0 var(--rate-delta-half) var(--rate-delta-height) var(--rate-delta-half);
 
    --rate-line-gap:0.1rem;
 
    --rate-gap-rateup:0.35rem;
    --rate-gap-ratedown:calc(var(--rate-btn-width) + var(--rate-gap-rateup) + 0.6rem );
    --rate-gap-cancel: calc(var(--rate-btn-width) + var(--rate-gap-ratedown) + 0.6rem );
 
 /* ----------------  侧边栏  ---------------------- */
 
    /* 左右空白 + 侧边栏 = 整个侧边栏尺寸 = 页面右侧空白  */
    --sidebar-width:14rem;
    --sidebar-blank-right:1rem;
    --sidebar-blank-left:2rem;
    --sidebar-blank-top:6rem;
    --content-width:54rem;   
    --sidebar-total-width:calc(var(--sidebar-width) + var(--sidebar-blank-left) + var(--sidebar-blank-right)) ;  
 
    /* 背景颜色 */
     --sidebar-bg-pc:var(--page-bg);
     --sidebar-bg-mob:transparent;
     --sidebar-cover-mob:var(--header-cover);
 
    /* 项目颜色 */
    --sidebar-btn-border:var(--color-darker);
    --sidebar-btn-txt:var(--color-darker);
    --sidebar-btn-bg:var(--color-navy);
 
    --sidebar-link-txt:var(--color-navy);
    --sidebar-link-bg:transparent;
    --sidebar-link-hoverTXT:var(--color-light);
    --sidebar-link-hoverBG:var(--accentColor);
 
/* 栏线颜色 */
    --sidebar-hd-txt:var(--accentColor);
    --sidebar-line:var(--sidebar-hd-txt);
    --sidebar-content-color:var(--sidebar-hd-txt);
    --sidebar-hd-txtMOD:var(--sidebar-hd-txt);
 
   --color-hr-sidebar:var(--color-navy);
 
/* 栏头 */
    --sidebar-topBox-size:8rem;
    --sidebar-topBox-top:calc(var(--sidebar-topBox-size) / 2 * -1) ;
    --sidebar-topBox-top222:1rem;   
    --sidebar-topBox-left:calc((var(--sidebar-width) - var(--sidebar-topBox-size)) / 2 ) ;   
 
   /* ---------  引用块  --------- */
 
    --blockquote-bg:rgba(236,235,220, 0.6);
    --blockquote-bg222:rgba(220,220,230, 0.2);
    --blockquote-border:rgba(33,33,33,0.4);
    --blockquote-border-left:rgba(33,33,33,0.7);
 
  /* --------- 分割线 --------- */
 
      --color-hr:rgba(128,128,128,0.8);
 
  /* --------- 目录 --------- */
 
    --TOCbd-cl:var(--color-navy);
    --TOC-tt-cl:var(--color-navy);
    --TOC-tt-bg:var(--page-bg);
 
       --TOC-txt-size:1rem;
       --TOC-line-height:1.6rem;
       --TOC-tt-txt:'目 录';
       --foldToc-txt:'收起';
      --unfoldToc-txt:'展开';
 
  /* --------- 特殊 div 样式 --------- */
 
    /* 泛黄块 */
    --mz-paper-bg:rgba(236,235,220, 0.6);
    --mz-paper-bg222:#e9e9e2;
 
   /* --------- 维基图片框 --------- */
 
    --mz-img-bg:var(--page-bg);
    --shadow-gap:var(--mz-img-bg);
    --shadow-line:var(--color-navy);
 
    --box-line:drop-shadow(0px -1px 0.5px var(--shadow-line)) drop-shadow(0px 0px 0px var(--shadow-line))
        drop-shadow(0px 0px 0.5px var(--shadow-line)) drop-shadow(0px 0px 0px var(--rate-boder-flag))
        drop-shadow(0px 0px 0.5px var(--shadow-line)) drop-shadow(0px 0px 0px var(--rate-boder-flag))
        drop-shadow(0px 0px 0.1px var(--shadow-gap)) drop-shadow(0px 0px 0.1px var(--shadow-line))
        drop-shadow(0px 0px 0.1px var(--shadow-gap)) drop-shadow(0px 0px 0.1px var(--shadow-gap))
        drop-shadow(0px 0px 0.5px var(--shadow-line)) drop-shadow(0px 0px 0px var(--shadow-line))
        drop-shadow(0px 0px 0.5px var(--shadow-line)) drop-shadow(0px 0px 0px var(--shadow-line))
        drop-shadow(0px 0px 0.5px var(--shadow-line)) drop-shadow(0px 0px 0px var(--shadow-line));
 
 /* ----------- TAB 样式 ----------- */
 
    --tabNAV-txt:var(--color-navy);
    --tabNAV-txtHover: var(--color-light);
    --tabMain-txt: var(--color-darker);
 
    --tabNAV-bgHover:var(--accentColor);
    --tabNAV-bgSelect:var(--tabNAV-bgHover);
 
    --tabNAV-txtSelect:var(--tabNAV-txtHover);
    --tabNAV-bgAct:var(--tabNAV-bgHover);
    --tabNAV-txtACT:var(--tabNAV-txtHover);
 
    --tabNAV-border:var(--color-darker);   
   --tabMain-border:var(--accentColor);
   --tabNAV-bg:var(--color-grey-darker);
   --tabMain-bg:var(--color-grey-dark);
    --tab-shadow:var(--color-grey-darkest);
 
    /* 深线样式 */
    --Line-tabNAV-txt:var(--color-navy);
    --Line-tabNAV-txtHover:var(--color-light);
 
   --Line-tabNAV-txtSelect:var(--Line-tabNAV-txtHover);
   --Line-tabNAV-txtACT:var(--Line-tabNAV-txtHover);
 
   --Line-tab-base:var(--color-navy);  
    --Line-tabNAV-bgHover:var(--Line-tab-base);
    --Line-tabNAV-bgSelect:var(--Line-tabNAV-bgHover);
    --Line-tabNAV-bgAct:var(--Line-tabNAV-bgHover);
 
    --Line-tabNAV-border:var(--Line-tab-base);
    --Line-tabMain-border:var(--Line-tab-base);
 
   --Line-tabNAV-bg:var(--page-bg);
   --Line-tabMain-bg:var(--Line-tabNAV-bg);
   --Line-tab-shadow:transparent;
   --Line-tabMain-txt:var(--Line-tab-base);
 
   --Line-tabBD-weight:3px;
 
    /* ------------- 文本标题框 -------------  */
     --ttbox-padding:0.5rem;
    --ttbox-margin:0.5rem;
 
    --ttbox-h1BDR-color:var(--color-navy);
    --ttbox-boxBDR-color:var(--ttbox-h1BDR-color);
    --ttbox-before-color:var(--ttbox-h1BDR-color);
 
    --ttbox-h1-color:var(--color-navy);
 
    --ttbox-h1-bg:var(--page-bg);
     --ttbox-box-bg:var(--page-bg);
 
    --ttbox-box-size:0.2rem;
    --ttbox-border-size:0.25rem;
 
    --ttbox-h1-size:1.2rem;
    --ttbox-h1-top:calc(0rem - var(--ttbox-h1-size) );
    --ttbox-h1-left:calc(0rem - var(--ttbox-padding) * 4);
 
    --ttbox-before-size:3rem;
    --ttbox-before-left:calc(var( --ttbox-h1-left)  - var(--ttbox-padding) + var(--ttbox-border-size) / 2 + var(--ttbox-margin) / 2 + 2px);
    --ttbox-before-top:calc(0rem - var(--ttbox-padding) + var(--ttbox-h1-size) + var(--ttbox-border-size) * 2 );
 
/* ----------- 笔记本组件厚度 ----------- */
--cl-tab-bar:var(--color-navy);
 --cl-tab-bar222:#fff;
 
--img-chew444: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB2ZXJzaW9uPScxLjAnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zycgd2lkdGg9JzcwMC4wMDAwMDBwdCcgaGVpZ2h0PSc0OS4wMDAwMDBwdCcgdmlld0JveD0nMCAwIDcwMC4wMDAwMDAgNDkuMDAwMDAwJyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSd4TWlkWU1pZCBtZWV0Jz48ZyB0cmFuc2Zvcm09J3RyYW5zbGF0ZSgwLjAwMDAwMCw0OS4wMDAwMDApIHNjYWxlKDAuMTAwMDAwLC0wLjEwMDAwMCknIGZpbGw9JyMwMDAwMDAnIHN0cm9rZT0nbm9uZSc+PHBhdGggZD0nTTEgMzQzIGMwIC04MiAzIC0xNTUgNyAtMTYzIDQgLTggMTYgLTE2IDI3IC0xOCAxMSAtMiAzNCAtMTcgNTAgLTMzIDM1IC0zMiA5MyAtNDAgMTE1IC0xNCA3IDggMzQgMTUgNjMgMTcgNTAgMyA1MyA0IDcyIDQ1IDIwIDQxIDIxIDQyIDcxIDQzIDI4IDAgNjYgMyA4NCA3IDMwIDYgMzMgNCAyNSAtMTMgLTggLTIwIC0yMCAtMTQ0IC0xNCAtMTQ0IDMgMCAyOSAxMCA1OSAyMSAzMCAxMiA3NiAyNCAxMDEgMjYgNDEgNCA1MSAxIDgyIC0yNiAzOSAtMzUgMzkgLTM1IDUxIDQwIDQgMjAgMTggNDkgMzMgNjMgMjMgMjMgMjggMjUgMzUgMTEgNSAtOCAxMyAtMTUgMTggLTE1IDE0IDAgNzMgMTMyIDgxIDE4NCA5IDUyIDMwIDgzIDQ4IDcyIDYgLTQgMTEgLTE4IDExIC0zMCAwIC0zMiAxNiAtNDIgNzMgLTQ4IDU1IC02IDYxIDAgNzAgNzUgbDcgNDcgLTU4NSAwIC01ODUgMCAxIC0xNDd6Jy8+PHBhdGggZD0nTTEyMDAgNDgxIGMwIC01IDEyIC0zNCAyNiAtNjUgMjAgLTQ0IDI0IC02NiAxOSAtOTMgLTcgLTQxIDExIC05NyAzMSAtODkgNyAzIDE1IC0xIDE3IC04IDMgLTggMTcgLTEyIDMyIC0xMSAyOCA0IDY1IC0yMSA2NSAtNDIgMCAtMTggMzUgLTE2IDUxIDMgMTYgMjAgNzEgNDkgODYgNDYgNyAtMiAxOSAxMCAyNyAyNSAxOCAzNiA2NCA3OSA5MyA4NyAxNSA1IDI2IDIwIDMzIDQ2IDYgMjIgMTQgNDIgMTkgNDUgMjEgMTIgNjcgLTggODQgLTM3IDE1IC0yNiAyMSAtMjkgNTAgLTI0IDE3IDMgNTEgOCA3NSAxMiBsNDIgNyAwIC01MyBjMCAtNjUgMjIgLTk3IDExMiAtMTY2IDU3IC00MyA2NCAtNDYgOTcgLTM4IDMwIDggNDIgMjEgODUgOTQgNTMgODkgOTEgMTE4IDE3MyAxMzUgMjYgNSAzMiAzIDM4IC0xNCA3IC0yMyAzNCAtMjggNTIgLTEwIDkgOSAyOSAxIDc4IC0zMCA5MiAtNTkgMTEzIC02NiAxMzYgLTQ1IDE1IDEzIDM5IDE3IDEwNyAxNyA4MiAwIDk1IC0zIDE2OCAtMzcgNjEgLTMwIDkwIC0zOCAxMjkgLTM3IDI4IDEgNjcgMiA4OCAyIDIxIDEgMzcgNiAzNyAxMyAwIDEyIDEyMyAxMyAxODYgMSA1NiAtMTAgMTA4IDMwIDEyMCA5NSAxMCA1MyAzOSAxMDIgNzcgMTMyIDMxIDI0IDM2IDI1IDQyIDEwIDMgLTkgMyAtNDUgLTEgLTc5IC03IC02NyAzIC05MyAzNSAtOTMgOSAwIDQyIC0yNCA3MiAtNTMgNTIgLTUxIDU5IC01NCAxMjAgLTYwIDM1IC0zIDgwIC0zIDk5IDIgMzAgNyAzOCA0IDU1IC0xNiAxMSAtMTMgMjkgLTI0IDQwIC0yNSAzMyAtMSAxNDYgMjEgMTU5IDMxIDcgNiAxOCA0IDMwIC01IDExIC04IDMwIC0xNCA0MiAtMTQgMTIgMCAzOCAtNyA1NyAtMTUgODMgLTM0IDE2MiAtNiAyNzQgOTggOTUgODggMTA0IDkxIDE4MyA3MyA3NCAtMTggMTg0IC0yMCAyNTAgLTUgNzkgMTggMTU5IDIyIDE3NCAxMCAxMiAtMTAgMTIgLTE2IDAgLTM5IC0yOSAtNTYgLTkgLTk5IDQ4IC0xMDUgMjAgLTIgNDggLTE0IDYzIC0yNiA2MCAtNDcgMTk3IC0xNiAyNTMgNTYgMTcgMjQgMzMgMzMgNTIgMzMgMTYgMCAzNSA2IDQyIDEzIDcgNyAzNCAyNSA2MSAzOSBsNDcgMjcgMCAtMzkgYzAgLTIxIDUgLTQyIDEwIC00NSA2IC00IDggLTE1IDUgLTI2IC0xMCAtMzIgMjEgLTM0IDYzIC01IDIxIDE0IDQxIDI2IDQ0IDI2IDQgMCAxNiAtMTYgMjggLTM0IDI5IC00OCA3NCAtNzMgMTQ2IC04MSA3MyAtOSAxMTQgMyAxODQgNTEgMjcgMTkgNTcgMzQgNjUgMzQgOSAwIDI3IDcgNDAgMTYgMjIgMTQgMTE2IDQ0IDE0MSA0NCA3IDAgOSAtMTcgNiAtNTAgLTYgLTY5IDAgLTgzIDMzIC02OCAyMCA5IDI4IDkgMzMgMSAxMSAtMTcgMjQ0IC0xMyAyNTcgNCA2IDcgMjUgMTUgNDQgMTggNzMgMTIgNzEgOCA3MSAxODUgbDAgMTYwIC0yOTAwIDAgYy0xNjYxIDAgLTI5MDAgLTQgLTI5MDAgLTl6Jy8+PC9nPjwvc3ZnPiA=");
 
}
 
/*
------------------------------------------------
窄屏根属性
------------------------------------------------
*/
 
@media (max-width:1000px){
    :root{
  /* ----------------  侧边栏  ---------------------- */
    --sidebar-blank-right:0rem;
    --sidebar-blank-left:0rem;
 
  }
 
}
/*
=====================================
页面全局
=====================================
*/
 
body {
    font-family:var(--page-font), sans-serif;
    background-color: var(--page-bg);
    background-image:none;
}
 
#page-content p{
    font-size: 1.1em;
}
 
tt {
    font-family:var(--teletype-font);
    font-size: 98%;
}
 
::selection {
     color: white;
    background:var(--color-blue);
}
 
::-moz-selection {
     color: white;
    background:var(--color-blue);
}
 
a {
    color: var(--color-red);
}
 
a:visited {
    color:var(--accentColor);
}
 
a.newpage {
    color: var(--color-kraft);
}
 
/* ----------------- 字体及字重 -------------------- */
 
div#extra-div-1:before, div#extra-div-1:after, #page-title,
   #header h1 a:before,  #header h2 a:before, #page-content h1,
   #page-content h2, #page-content h3, #page-content h4,
   #page-content h5, #page-content h6 {
        font-family:'华文中宋', 'Noto Serif SC', serif;
        font-weight:600;
        font-family:var(--page-tt-font,'Noto Serif SC'), serif;
}
 
#header h1 a::before, #header h2::before {
    font-family:var(--header-tt-font,'Noto Serif SC'), serif;
    font-weight:var(--header-tt-font-weight,600);
}
 
#header h2::before {
    font-weight:var(--header-h2-font-weight,600);
}
 
#side-bar ,#top-bar, .page-tags,
.hovertip, #page-content {
   /*! font-family:var(--page-txt-font,'Noto Sans SC'), serif; */
}
 
@media (max-width: 600px) {
div#extra-div-1:before,div#extra-div-1:after, #page-title,
   #page-content h1, #page-content h2, #page-content h3,
   #page-content h4, #page-content h5, #page-content h6 {
       font-family:var(--mob-tt-font);
       font-weight: 600;
  }
}
 
/*
=====================================
版头
=====================================
*/
 
div#header {
    background-image: none;
    width: 100%;
   max-width: 100%;
}
 
div#container-wrap {
    background-image: none;
}
 
/* ---------------- 版头标题 --------------------- */
#header h1, #header h2 {
    margin-left: 0;
    float: none;
    text-align: center;
}
 
#header h1 span, #header h2 span {
    font-size: 0;
    display: none;
}
 
#header h1 a::before, #header h2::before {
    text-shadow: none;
}
 
div#header h1 a{
    top: var(--header-h1-top,-0.8rem);
    position: relative;
    letter-spacing: 0.1rem
}
 
div#header h1 a:before{
    font-weight: 300;
    font-size:4rem;
    /*! top:-1rem; */
    content: var(--header-title);
    color: var(--header-tt-color);
    position: relative;
    top:var(--hdtt-top);
}
 
#header h2::before {
   content: var(--header-subtitle, "控制、收容、保护");
   position: relative;
   font-size: 1.25rem;
    top:var(--hdtt-subtop);
   color: var(--header-subtt-color);
}
 
@media (max-width: 767px) {
  div#header h1 a::before {
     content: var(--pad-title,"SCP基金会");
     font-size:3rem;
     top: var(--hdtt-top-pad);
   }
 
   div#header h2::before {
      content: var(--pad-subtitle, "控制、收容、保护");
      top:var(--hdtt-subtop-pad);
   }
}
 
@media (max-width: 480px) {
  div#header h1 a::before {
     content: var(--mob-title,"SCP基金会");
     font-size:3rem;
     top: var(--hdtt-top-mob);
   }
 
   div#header h2::before {
      content: var(--mob-subtitle, "控制、收容、保护");
      top:var(--hdtt-subtop-mob);
   }
}
 
/* ---------------- 标志 ---------------- */
 
#header-extra-div-1{
    height: 140px;
    width: 100%;
    top: 0;
    position: absolute;
    background-color:var(--header-bg);
    background-image: var(--header-cover);
    background-size:300px;/* 20% */
    background-position: 0% 0%;
    background-repeat: repeat;
    z-index:-1;
}
 
#header-extra-div-1::after {
    content:" ";
    height: 30px;
    width: 100%;
    top: 135px;
    position: absolute;
    background:var(--topbar-bg);
    background-size: cover;
    background-position: 0% 0%;
    z-index: 0;
    position: absolute;
}
 
#header-extra-div-1::before {  
    content:" ";
    height: 150px;
    width: 100%;
    top: var(--logo-top);
    position: absolute;
    background-size: var(--logo-size);
    background-position:var(--logo-position);
    background-repeat: no-repeat;
    z-index:10;
    background-image:var(--logo-image);
    opacity: var(--logo-opacity);
}
 
@media (max-width: 767px) {
  #header-extra-div-1::before {  
    top: var(--logo-top-mob, 1rem);
    background-size: var(--logo-size-mob, 110px);
    background-position:var(--logo-position-mob, 50% 50%);
    opacity: var(--logo-opacity-mob, 0.15);
  }
}
 
@media (max-width: 520px) {
  #header-extra-div-1::before {  
    background-image: var(--logo-image-mob);
  }
}
 
/* --------------- 用户栏 ---------------------- */
 
#login-status img{
        display: none;
}
 
#login-status  {    
      color: transparent;
      top:1.2rem;    
}
 
#my-account {
    text-decoration: none;
}
 
#login-status #my-account:hover  {
    color: var(--user-unline);
    text-decoration: none;
}
 
#login-status .printuser{    
    letter-spacing: 0.1rem;
    background-image: linear-gradient(4deg,transparent 0%, transparent 10%, var(--user-line) 11%, var(--user-line) 16%,transparent 17%, transparent 100%);
}
 
#account-topbutton,
#login-status .printuser,
#login-status #my-account {
    background-size: contain;
    position: relative;
    white-space:nowrap;  
 
     --trans-user:2deg;  
-ms-transform:rotate(var(--trans-user));
-moz-transform:rotate(var(--trans-user));     
-webkit-transform:rotate(var(--trans-user));
-o-transform:rotate(var(--trans-user));
    transform:rotate(var(--trans-user));
}
 
#login-status .printuser:after{
   content: ' \00A0 \00A0';
}
 
#login-status .printuser:before{
   content: ' \00A0 ';
}
 
#login-status .printuser, #login-status #my-account , #account-topbutton{
     font-family: var(--handwriting-font);
      color: var(--user-line);
      font-size: 1.5rem;
}
 
#account-topbutton{
    top:1rem;
    font-size: 0rem;
    border: none;  
}
 
#account-topbutton:before {
    color: var(--user-line);
    content: '\f007';
    font-family: FontAwesome;
    font-size: 1rem;
    border:  var(--user-line) solid 2px;  
    border-radius:40%;
    padding: 2px;
    position: relative;    
}
 
#account-options{
   font-size: 1rem;
    left: -17.5rem;
}
 
#account-options {
    background-color: var(--header-bg);
    border: 2px solid var(--user-line);
}
 
#account-options a {
    background-color: var(--header-bg);
    border: 1px solid var(--user-line);
    text-decoration: none;
}
 
#login-status  #account-options a:hover {
    background-color: var(--user-line);
    color: var(--user-list-txtHVR);
    border: 1px solid var(--user-unline);
}
 
#login-status{
    top: 0.8rem;
    right: 0rem;
    float: right;
    display: flex;
    flex-wrap: wrap;
}
 
#login-status .printuser{    
   margin-left: -0.8rem;
   top:1.8rem;
   font-size: 1.2rem;
   order: 3
}
 
#my-account {
    right: 0rem;
    text-decoration: none;
    top:-1.6rem;
    margin-left: -1rem;
    order:3;
    flex-basis: 100%;
}
 
#account-topbutton{
    top:2.8rem;
    margin-left: -2rem;
    order:0;    
}
 
#account-topbutton:before {
    color: var(--user-line);
    font-size: 1rem;
    top:-1rem;
    left: -0.8rem;
}
 
 /*  
----------------------
1200px时，
将用户栏放置左边，弃用
 
@media (max-width: 1200px) {
 
        #login-status{
        top: 1rem;
        left:    inherit ;
         right:   auto;
        float: none;
            position: absolute  ;
    }
 
      #login-status .printuser {
      font-size: 1.5rem;
}
 
  #login-status #my-account {
      font-size: 2rem;
}
 
   #login-status .printuser{    
          top:2.4rem;
       float: right;
    }
 
    #my-account {
    left:0rem;
    text-decoration: none;
        top:0rem;
}
 
#account-topbutton{
      top:2.8rem;
    left: -0rem;
}
        #account-options{
         left: 1.5rem;
    }
 
#account-topbutton:before {
          color: var(--accentColor);
      font-size: 1rem;
    top:-0.5rem;
    left: -1rem;
}
}
----------------------
*/
 
/* 私信 */
#login-status :not(div) + a[href*="messages"]{
    color:var(--user-unline);
    left:5.5rem;
    top:0.5rem;
    position: relative;
    padding: 0rem;
    font-size: 0rem;
    width: 2rem;
    z-index: 2;       
}
 
#login-status  :not(div) + a[href*="messages"]:before{
    content: '\f0e0 ';
    font-size: 1.2rem;
    font-family: 'FontAwesome';
    padding: 1rem;
    color:var(--user-line);
 
    -webkit-animation-name: sssblink;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: cubic-bezier(1.0, 0, 0, 1.0);
    -webkit-animation-duration: 1s;
    animation-name: sssblink;
    animation-iteration-count: infinite;
    animation-timing-function: cubic-bezier(1.0, 0, 0, 1.0);
    animation-duration: 1s;
}
 
#login-status  :not(div) + a[href*="messages"]:hover:before{
   color:var(--header-mob-hover);
    -webkit-animation-play-state:paused;
    animation-play-state:paused;
}
 
#login-status > a > strong {
    text-decoration: none ;
}
 
@-webkit-keyframes sssblink {
    from { content: '\f0e0 '; }
    to { content: '\f003'; }
}
 
@keyframes sssblink {
    from { content: '\f0e0 '; }
    to { content: '\f003'; }
}
 
/* 未登录 */
#login-status a[class*="creat"],
#login-status a[class*="creat"] + span,
#login-status a[class*="sign-in"]{
  color:var(--user-line);
  font-family:var(--page-tt-font);
  padding-right:0.5rem;
}
 
#login-status a[class*="creat"] + span {
  color:var(--user-unline);
}
 
#login-status a[class*="sign-in"]{
  margin-right:3rem;
}
 
@media (max-width: 1200px) {  
   #login-status a[class*="sign-in"]{
        margin-right:0rem;
   }
 
   #account-options{
    left: 2rem;
   }
 
   #login-status :not(div)  + a[href*="messages"]{
     left:-1rem;
     top:0rem;   
  }
 
   #login-status{
       top: 1rem;
       max-width: 100px;
       margin-right: 1rem;
       left: 1.5rem;
       flex-wrap: initial;
    }
 
   #account-topbutton:before,
   #account-topbutton,
   #login-status .printuser,
   #login-status #my-account {
      display: inline-flex ;
      flex-wrap: nowrap;    
      position:revert;
      white-space:nowrap;  
      left: 0;
      right: 0;
      top:0;
      margin-right: 0rem;
      margin-left: 0;
 
      --trans-user000:0deg;  
      transform:rotate(var(--trans-user000));
      -ms-transform:rotate(var(--trans-user000));
      -moz-transform:rotate(var(--trans-user000));     
      -webkit-transform:rotate(var(--trans-user000));
      -o-transform:rotate(var(--trans-user000));   
   }
 
    #account-topbutton::before {
      order:0;
   }
 
    #login-status .printuser{
      order: 1;       
   }     
 
  #login-status #my-account {
        display: none;
    }
 
  #login-status .printuser {
    font-size: 1.2rem;
  }
}
 
@media (max-width: 770px) {
  #account-options{
       left: -15.6em;
  }
 
  #login-status :not(div)  +  a[href*="messages"]{
     left:0.6rem;
    top:0px;   
  }
 
   #login-status .printuser,  
   #login-status #my-account {
        display: none;
    }
 
  #account-topbutton:before {
    color: var(--user-line);
    font-size: 1rem;
    text-align:center;   
    border:  var(--user-line)) solid 2px;  
    border-radius:30%;
    padding:2px;
    margin-top:52px;
    width: 1.1rem ;
    left:-10px;
    position:  absolute;
    padding:0.15rem  0rem 0.1rem 0.25rem;
    float: right;
  }
}
 
/* --------------- 搜索框 ---------------------- */
 
#search-top-box-form {
   position: relative;
    right:2rem;
    top:1rem;
}
 
#search-top-box input.empty,
#search-top-box-input {
    border: solid 2px var(--search-line);
    background-color: transparent;
    box-shadow: none;
    color: var(--search-txt);
}
 
#search-top-box-form #search-top-box-input:hover,
#search-top-box-form  #search-top-box-input:focus {
    border: solid 2px var(--search-line);
    color: var(--search-txt-hover);
    background-color:var(--search-bg-hover);
    box-shadow: none;
}
 
#search-top-box-form input[type="submit"]:focus,
#search-top-box-form input[type="submit"]:hover {
    color: var(--search-txt-hover);
    background: var(--search-bg-hover);
    border: solid 2px var(--search-line);
    box-shadow: none;
}
 
#search-top-box-form input[type="submit"] {
    color: var(--search-txt);
    background: transparent;
    box-shadow: none;
    border: solid 2px  var(--search-line);
}
 
@media (max-width:1200px) {
    #search-top-box-input {
    border: solid 2px var(--search-line);
    color: var(--search-txt);
    background-color: transparent ;
    box-shadow: none;
  }
 
  #search-top-box-form {
    position: relative;
    right: 2rem;
    top:-60px;
  }   
}
 
@media (max-width: 770px) {   
   #search-top-box-input {
        display: none;
    }
 
    #search-top-box-form input[type="submit"]:hover,
    #search-top-box-form input[type="submit"] {   
         font-size: 0;
        background: var(--search-bg);     
    }
 
    #search-top-box-form .btn,
    #search-top-box,
    #search-top-box .btn{
        position: absolute;
    }
 
   #search-top-box{
       top:50px;
       width: 0;  
    }
 
   #search-top-box-form{
       right:1.7rem;
       top:30px;
    }
 
    #search-top-box-form .btn{
       width: 1.5rem;
        height:1.5rem;
        margin-top:1.2rem;
       left:0;
    }
 
    #search-top-box-form:before{
         position: relative;
         content: '\f002 ';
         font-family:FontAwesome;
         color: var(--search-txt);
         z-index: -1;
         float: left;
 
        left:0.5rem;
        margin-top:1.5rem;
   }
}
 
/* 综合用户栏和搜索栏 */
   #search-top-box-form:hover,
   #search-top-box-form:hover:before,
    #account-topbutton:hover:before {
        color: var(--headbtn-line-hover);
        border-color: var(--headbtn-line-hover);
}
 
@media (max-width: 770px) {
   #search-top-box-form input[type="submit"]:hover {
        color: var(--headbtn-line-hover);
        border-color: var(--headbtn-line-hover);
   }
   #login-status{
       left:inherit;
       right: 0rem;
   }
}
 
/* ----------------- 顶栏 ---------------------- */
 
#top-bar {
    display: flex;
    justify-content: center;
    left: 0;
    right: 0;
}
 
@media (max-width:767px) {
  .mobile-top-bar {
     justify-content: center;
     display: inline-flex;
     left: 0;
     right: 0;
  }
}
 
#top-bar div.top-bar  > ul > li > ul,
#top-bar  .mobile-top-bar > ul > li > ul {
      border: var(--accentColor)  solid 2px  ;      
}
 
#top-bar ul li.sfhover ul li a,
#top-bar ul li:hover ul li a {
 border-top:1px solid var(--accentColor);
}
 
#top-bar li ul li a {
    background: var(--color-kraft);
          border: var(--accentColor)  solid 2px  ;      
 
}
 
#top-bar ul li a {
    border-left: solid 1px rgba(264,64,64,.2);
    border-right: solid 1px rgba(264,64,64,.2);
}
 
#header #top-bar a{
    color:var(--topbar-txt);
    text-align:center;
}
 
#header #top-bar .sfhover a{
    color: var(--accentColor);
   background-color:var(--color-kraft);
}
 
#header  #top-bar a:hover{
    background: var(--accentColor);
        color: var(--color-gold);
}
 
/*
=====================================
标题
=====================================
*/
 
/* ----------- 页面标题  ---------------- */
    /* 突出标题 */
 
#page-title{
    font-size: var(--page-tt-size);
    text-align: var(--page-tt-txtPOS);
    font-weight: bold;
    background-color: var(--page-tt-bg);
    color: var(--page-tt-txt);
    position: relative;
    margin: var(--page-tt-margin) ;
    border-top: var(--page-tt-topBorder) solid  var(--page-tt-top);
    border-bottom: 4px solid  var(--page-tt-bottom);
        flex-grow: 0;
 
    padding-top: var(--page-tt-topPADD);
    padding-bottom: var(--page-tt-btmPADD);
 
    /*! padding:var(--page-tt-padding) 0;
     margin-top: var(--pgtt-margin-top);
    height: var(--page-tt-height);
    position: relative; */
}
 
#page-title:before,
#page-title:after{
     content: '  ';
    position: absolute;
    display:  block;
}
 
#page-title:before{      
    content: var(--pgtt-before-content);
    text-align: center;
    font-size: var(--pgtt-before-size);
    width:var(--pgtt-before-width);
    height: var(--pgtt-before-height);
    background-color: var(--pgtt-before-contentBG);
    color:var(--pgtt-before-contentTXT);
    z-index: 0;
 
    position: absolute;
    left:var(--pgtt-before-left);
    padding: 0 0 0rem 0;
    margin: 0 auto;
 
    margin-bottom:var(--pgtt-before-bottom);
    font-family: 'FontAwesome',var(--rate-font);
    bottom: 0;
 
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%;
}
 
#page-title:after{    
    z-index: -1;
    width:var(--pgett-after-width);
    border-bottom: 3px solid var(--page-tt-bottom);
    margin: 0 auto;
    top:var(--pgtt-after-top);
    height: var(--pgtt-after-height);
 
    background:var(--pgtt-after-bg);
    position: relative;
 
    /* left:var(--pgett-after-left); */
}
 
#page-content{
    margin-top:var(--page-content-top);
}
 
@media (max-width: 700px) {
  #page-title{
     font-size: var(--page-tt-sizeMOB);
     padding: var(--page-ttMOB-padding) 0;
    /*! height: var(--page-tt-heightMOB); */
   }
   #page-title:after{    
      top: var(--pgtt-after-topMOB);
   }
 
  #page-title:before{
     margin-bottom:var(--pgtt-before-bottomMOB);
     font-size: var(--pgtt-before-sizeMOB);
     width: var(--pgtt-before-widthMOB);    
  }   
}
/* ----------- 内文一级标题  ---------------- */
 
#page-content h1 {
    font-weight: bold;
    margin-top: 0.6rem;
    margin-bottom: 0.6rem;
    display: flex;
}
 
#page-content h1 {
    font-weight: bold;
    /*! margin-top: 0.6rem; */
    margin-bottom: 0.6rem;
    display: flex;
}
 
#page-content h1::after {
    content: " ";
    flex-grow: 1;
    display: inline-flex;
    height: 0.1rem;
    margin: auto auto auto 0.375rem;
    color: var(--accentColor);
    background-color: var(--dark-accent);
    width:auto;
}
 
#page-content .note-nobody h1,
#page-content  blockquote blockquote h1,
#page-content .blockquote .blockquote h1,
#page-content  .yui-content h1 {
    display: block ;
}
 
h2, h3, h4, h5, h6 {
    color: var(--color-navy);
}
/*
=====================================
标题与侧边栏适应
=====================================
*/
 
#main-content{
    padding-top: 0;
    margin-top: 0em;
}
 
#side-bar .side-block:first-child {
    padding-top: 0;
    margin-top: 2em;
}
 
#content-wrap{
    display: flex;
    justify-content:  flex-start;
    align-items: flex-start;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    margin:0 auto;
    width:var(--main-width, 100vw);
}
 
#content-wrap{
    flex-grow: 1;
    width:var(--main-width, 100vw);
    padding: 0 0rem;
}
 
#main-content{    
    margin: 0 auto;
    width:var(--content-width, 56rem);
 
    max-width:calc(98% - var(--sidebar-total-width));  
    padding-right: var(--main-padding-right);
    padding-left:var(--main-padding-left);
    position: initial;
}
 
#side-bar,
#content-wrap:after{
    content: '  ';
    max-width: var(--sidebar-width);
    height:12rem;
    flex-grow: 1;
    flex-shrink: 0;
}
 
#content-wrap:after{
  flex-grow: 0;
  flex-shrink: 100;
  flex-basis:var(--sidebar-total-width,inherit);
  width: 0;
  margin-right:var(--sidebar-blank-left);
  margin-left:var(--sidebar-blank-right);
 
}
 
@media (max-width: 0rem){
      #main-content{    
    padding-left:10rem;
  }
}
 
@media (max-width: 767px){
    #content-wrap{
  }
 
  #main-content{    
     flex-grow: 1;  
     max-width:90%;
     margin: 0 auto ;
     padding-left:0;
     padding-right:0rem;
  }
 
  #content-wrap  #side-bar{
    left: -27em;
    flex-basis: 0;
    position: absolute;
  }
 
  #content-wrap:before,
  #content-wrap:after{
    display:none;
    position: absolute;
    margin:0;
  }       
}
 
/*
=====================================
侧边栏
=====================================
*/
 
/* ----------- 侧边栏样式 ---------------- */
 
#side-bar{
    flex-basis:var(--sidebar-width,inherit);
    min-width:var(--sidebar-width,16em);
    position:  relative;
    margin-left:var(--sidebar-blank-left);
    margin-right:var(--sidebar-blank-right);
    left: 0;
 
    height:100%;
    /*! border: #333 double 5px; */
    margin-top: var(--sidebar-topBox-top222);
    padding: 0;
     background-color: var(--sidebar-bg-pc);
}
 
#side-bar:before {
    content: ' ';
    display: block;
    position:  inherit;
    height:var(--sidebar-topBox-size);
    width: var(--sidebar-topBox-size);
 
    background-size: contain;
    background-image:var(--logo-sidebar);
    background-repeat: no-repeat;
    background-color: var(--sidebar-bg-pc);
   opacity: var(--logo-sidebar-opacity);
 
    left:var(--sidebar-topBox-left, 0);
 
   /* top:var(--sidebar-topBox-top);
      margin-bottom: var(--sidebar-topBox-top);
    */
}
 
/* 内部 */
#side-bar div.side-block:first-child{
margin-top: 0;
}
 
#side-bar div.side-block:first-child:before{
    content:var(--sidebar-content);
    content:{$sidebar-content};
    font-family: var(--handwriting-font);
    white-space:pre;
    font-size: 2rem;
 
    display: inline-block;
    position: inherit;
    text-align: center;
    margin: 1rem 0;
    width:100% ;
    background-color: ;
    padding: 0 0 0rem 0;
    line-height: 1.2em;
    color:var(--sidebar-content-color);
}
 
#side-bar div.side-block :not(a)  img{
    display: none ;
 
}
 
#side-bar div.side-block:not(.side-links) a  img{
    display: block ;
}
 
#side-bar div.side-block img[alt*="cc-by-sa"]{
    margin: 0 auto;
}
 
#side-bar div.side-block a[href*="https:"]:not([href*="wikidot"]){
    background: none ;
    padding: 0;
}
 
#side-bar .side-block {
    padding: 0rem 0.8rem;
    padding-top: 20px;
    border: none;
    border-radius:0px;
    box-shadow: none;
    background: transparent;
    background-color: transparent !important;
}
 
#side-bar .menu-item a[href="/"],
#side-bar .menu-item a:visited,
#side-bar .menu-item a{
    color: var(--sidebar-link-txt);
    padding:0.2rem  0.3rem;
}
 
#side-bar .menu-item a[href="/"]:hover,
#side-bar .menu-item a:hover {
    color:var(--sidebar-link-hoverTXT);
    background-color: var(--sidebar-link-hoverBG);
    text-decoration: none;
}
 
#side-bar .menu-item a[href="/"] {
    font-family: var(--handwriting-font);
    font-size: 1.5rem;
    top: 0.8rem;
    position: relative;
}
 
#side-bar .collapsible-block-unfolded-link .collapsible-block-link {
    font-size: inherit;
 
}
 
#side-bar .collapsible-block-unfolded-link,
#side-bar .collapsible-block-folded {
    background:none;
      border-bottom: 2px solid var(--sidebar-line);
}
 
#side-bar a.collapsible-block-link{
     color: var(--sidebar-line);
        text-decoration: none;
        margin-left: 0px !important;
font-family: 'FontAwesome',var(--rate-font);
}
 
#side-bar .collapsible-block-folded  a.collapsible-block-link:before{
   content: '\f059  \00A0 ';
 
}
 
#side-bar .collapsible-block-unfolded-link a.collapsible-block-link:before {
    content: '\f20b  \00A0';
}
 
#side-bar .side-block:nth-of-type(2) .menu-item:first-child{
    text-align: center;
}
 
#side-bar .collapsible-block .menu-item:first-child{
    padding-top: 0.5rem;
}
 
/* 栏目 */
 
#side-bar .heading {
    border-bottom: solid 0px transparent;
    padding:10px 0px 8px 0px;
    margin-bottom: 5px;
    font-size: 8pt;
    font-weight: bold;
}
 
#side-bar .heading p{
    color: #600;
    border-bottom:solid 2px var(--sidebar-hd-txt);
    padding-left: 0.2rem
}
 
#side-bar .collapsible-block-unfolded-link:after,
#side-bar .collapsible-block-folded:after,
#side-bar .heading p:after{
    content: ' ';
    position: relative;
    height: 0rem;
    width: 100%;
    top:0.3rem;
    width: 60%;
    display: block;
    border-bottom:solid 1px var(--sidebar-line);
}
 
/* ----------- 手机样式 ---------------- */
 
#content-wrap #side-bar:target {
    display: block;
    left: 0;
 
    position: fixed;
    background-color:var(--header-bg);
    background-image: var(--header-cover);
    background-size:300px;/* 20% */
    background-position: 0% 0%;
    background-repeat: repeat;
}
 
@media (max-width: 767px){
 #content-wrap #side-bar {
      position: fixed;
      top: 0;
      margin-top: 0;
      margin-left: 0;
      left: -20rem;
      z-index: 50;
      background-image: var(--header-cover);
      background-color:var(--sidebar-bg-pc);
      background-color:var(--header-bg);
  }
 
  #side-bar:before {
      content: ' ';
      position:  relative;
      z-index: -1;
      background-color: var(--sidebar-bg-mob);
      background-image: var(--logo-sidebar-mob);
   }
 
   #side-bar .menu-item a[href="/"] ,  
   #side-bar div.side-block:first-child:before{
     color:var(--sidebar-hd-txtMOD);
  }
 
    #side-bar:target {
    display: block;
    left: 0 !important;
    position: fixed;
  }
 
  #top-bar .open-menu a {
    position: fixed;
    top: 2.5rem;
    left: 0.5rem;
    z-index:20;
    font-size: 0rem;
 
    width:10px;
    height: 0px;
    border: 0.1em solid var(--sidebar-btn-border);
    color:  var(--sidebar-btn-txt);
   }
 
   #top-bar .open-menu a:before {
       content: '\f075 ';
       position: fixed;
       font-family: FontAwesome;
       font-size: 2rem;
       width:30px;
       height: 30px;
       color:  var(--sidebar-btn-txt);    
       line-height: 0;
       margin-bottom:-1rem
  }
 
  #top-bar .open-menu a:hover:before {
      font-size: 2.1rem;
      color: var(--accentColor) ;   
  }
}
 
/*
=====================================
评分栏
=====================================
*/
 
.rateBox .creditButton p a:focus,
.page-rate-widget-box a:focus{
user-select:none;
background:transparent;
}
 
/* ----------- 常规 ---------------- */
 
.page-rate-widget-box {
    border-radius: 0;
    box-shadow: none;
    margin-bottom: 0rem;
    margin-right: 0.5rem;
    position: relative;
    z-index: 0;
    user-select:none;
}
 
#main-content .page-rate-widget-box  .rate-points {
    border: solid 0px transparent;
    border-bottom: solid 2px var(--rate-num-border);
    display:  block;
    border-radius: 0;
    padding-top:var(--rate-padding-top, 0.6rem);
    padding-right:var(--rate-padding-left, 1rem);
 
    font-size: 0;
        color:var(--rate-num-txt) ;
    z-index:1;
    background-color: var(--page-bg) !important;
    position: relative;
}
 
.page-rate-widget-box  .rate-points:after {
    content: ' ';
    width: 100%;
 
    background-color: transparent !important;
    border: solid 0px transparent;
    border-top: solid 2px var(--rate-num-border);
    display: block;
    border-radius: 0;
    padding: var(--rate-line-gap) 0rem 0 0rem;
}
 
.rate-points .number {
    font-size: var(--rate-num-size) ;
    background-color:var(--rate-num-bg) ;
    color:var(--rate-num-num) ;
    padding: 0 var(--rate-num-padding) ;
    letter-spacing: 1px;
}
 
.page-rate-widget-box  .rate-points:before {
    content: '\f18e  评分';
font-size: 0.8rem;
    padding:  0 0.5rem 0 0.6rem;
        font-family: 'FontAwesome',var(--rate-font);
    letter-spacing: 0.2rem;
      color: var(--rate-info-btn);
 
}
 
.page-rate-widget-box:hover  .rate-points:before {
    content: '\f0ab  评分';
}
 
/*  评分旗子  */
 
.page-rate-widget-box   span.btn {
    background-color: transparent;
    border: solid 0px transparent;
    /*! left:var(--rate-flag-left); */
}
 
.page-rate-widget-box .btn:not(:first-child){
    border-radius: 0;
    z-index: 0;
    font-size: var(--rate-btn-size);
    width: 0;
 
     display: inline-flex;
     flex-wrap: wrap;
     justify-content:  left;
     margin-right:var(--rate-btn-mgleft);
     height:var(--rate-btn-height);
     width: var(--rate-btn-width);
     background-color:  var(--rate-btn-bgcolor);
     position: absolute;  
     left: 0;
 
     --rate-btn-filter: drop-shadow(0px -1px 0.5px var(--rate-boder-flag)) drop-shadow(0px 0px 0px var(--rate-boder-flag))
         drop-shadow(0px 0px 0.5px var(--rate-boder-flag)) drop-shadow(0px 0px 0px var(--rate-boder-flag))
         drop-shadow(0px 0px 0.5px var(--rate-boder-flag)) drop-shadow(0px 0px 0px var(--rate-boder-flag))
         drop-shadow(0px 0px 0.1px  var(--page-bg)) drop-shadow(0px 0px 0.1px var(--page-bg))
         drop-shadow(0px 0px 0.1px  var(--page-bg)) drop-shadow(0px 0px 0.1px  var(--page-bg))
         drop-shadow(0px 0px 0.5px var(--rate-boder-flag)) drop-shadow(0px 0px 0px var(--rate-boder-flag))
         drop-shadow(0px 0px 0.5px var(--rate-boder-flag)) drop-shadow(0px 0px 0px var(--rate-boder-flag))
         drop-shadow(0px 0px 0.5px var(--rate-boder-flag)) drop-shadow(0px 0px 0px var(--rate-boder-flag));   
 
       -webkit-filter:var(--rate-btn-filter);
       filter:var(--rate-btn-filter);
}
 
.page-rate-widget-box span.rateup{
    margin-left: var(--rate-gap-rateup);
}
 
.page-rate-widget-box .ratedown{
   margin-left: var(--rate-gap-ratedown) ;;
}
 
.page-rate-widget-box .cancel{
   margin-left: var(--rate-gap-cancel);
}
 
.page-rate-widget-box .btn:last-child{
     margin-right: var(--rate-flagLAST-mgRidght, 0.6rem);
}
 
.page-rate-widget-box .btn:not(:first-child) a{
    padding:0;
    width: 100%;
    text-align: center;
    display: block;
}
 
.page-rate-widget-box .btn:not(:first-child):after{
    content: ' ';    
   height: 0;
   border-style: solid;
   border-width: var(--rate-delta-size);
   border-color: var(--rate-btn-bgcolor) var(--rate-btn-bgcolor) transparent var(--rate-btn-bgcolor);       
    position: relative;
    top:var(--rate-flag-underTOP, 0.15rem);  
}
 
/* 模块底界 */
.page-rate-widget-box:after{
    position: absolute;
    content: ' ';
    width: 100%;
    height: var(--rate-btn-width);    
    background-color: transparent ;
    display: block;
    z-index: -1;
    }
 
.page-rate-widget-box .btn:not(:first-child){
}
 
/* 鼠标移过 */
.page-rate-widget-box .btn:not(:first-child):hover a {
    background: transparent;
        color:var(--rate-hover-txt);
}
 
.page-rate-widget-box .btn:not(:first-child):hover {
    background-color: var(--rate-hover-bg);  
}
 
.page-rate-widget-box .btn:not(:first-child):hover:after{
   border-color:var(--rate-hover-bg) var(--rate-hover-bg) transparent var(--rate-hover-bg);       
}
 
.page-rate-widget-box .btn:not(:first-child){
    z-index: 0;
     top:var(--rate-flag-top);
    transition-property:var(--rate-flag-top);
    transition-duration: 0.5s;
}
 
.page-rate-widget-box:hover .rateup,
.page-rate-widget-box:hover .ratedown,
.page-rate-widget-box:hover .cancel  {
    top:0rem;
    transition-property:top;
    transition-duration: 0.5s;
     top:var(--rate-flag-topHover);
}
 
.page-rate-widget-box:hover .rateup {
transition-delay: 0s;
 
}
 
.page-rate-widget-box:hover .ratedown {
   transition-delay: 0.2s;
}
 
.page-rate-widget-box:hover .cancel {
   transition-delay: 0.3s;
}
 
/* ----------- 著作信息栏 ---------------- */
 
.rateBox .rate-box-with-credit-button{
    background-color: transparent;
   border: none;
   border-radius: 0x;
   box-shadow: none;   
user-select:none;
}
 
.rateBox .rate-box-with-credit-button{
    display: flex;
}
 
#page-content .creditRate{
  margin-right: 0.5rem;
}
 
.rateBox .creditButton p a {
    color: var(--rate-info-btn);
    border-left: none;
    padding-top: 0rem;
    border-left: solid 2px  var(--rate-info-border);
    margin: 0.5rem 0 0 0.4rem;
   padding: 0rem 0.4rem ;
    margin-top: var(--rate-padding-top);
}
 
.rateBox  .fa-info::before {
    content: "著作 \D\A 信息";
    white-space:pre;
    line-height: 1rem;
    padding: 0 ;
    left: -0.25rem;
    position:relative;
   word-break: keep-all;
 
}
 
.modalbox hr{
    border: none;
}
 
.rateBox .creditButton p a:hover {
    color: var(--rate-info-btnHover-txt);
    background-color:  var(--rate-info-btnHover);
}
 
.rateBox   .btn:not(:first-child){
    /*! right:-1.2rem; */
}
 
.modalcontainer  .modalbox .close-credits {
filter: sepia(100%)   saturate(500%) brightness(200%);
 
}
 
.modalcontainer  .modalbox h2{
    color: var(--rate-mobox-tt);
}
 
#main-content .modalbox .page-rate-widget-box  .rate-points {
    background-color: var(--rate-mobox-bg) !important;
}
 
.modalcontainer  .modalbox {
    background: linear-gradient(var(--rate-mobox-border) 51px,var(--rate-mobox-bg) 51px) !important;;
    border: var(--rate-mobox-border) solid 4px;
    color: #000;
}
 
.modalcontainer  .modalbox {
    background: linear-gradient(var(--rate-mobox-border) 51px,var(--rate-mobox-bg) 51px) !important;;
    border: var(--color-navy) solid 4px;
}
 
 .modalbox  .page-rate-widget-box .btn:not(:first-child):after{
   border-color:var(--rate-mobox-bg) var(--rate-mobox-bg) transparent var(--rate-mobox-bg);       
}
 
 .modalbox  .page-rate-widget-box .btn:not(:first-child),
 .modalbox  .page-rate-widget-box  .rate-points {
    background-color: var(--rate-mobox-bg) !important;
}
 
 .modalbox  .page-rate-widget-box .btn:not(:first-child):hover {
    background-color: var(--rate-mobox-btn)!important;
}
 
 .modalbox  .page-rate-widget-box .btn:not(:first-child):hover:after{
   border-color:var(--rate-mobox-btn) var(--rate-mobox-btn) transparent var(--rate-mobox-btn);       
}
 
 .modalbox  .page-rate-widget-box {
    top:-10px;
}
 
 .modalbox  .rate-points .number {
    background-color: var(--rate-mobox-border) ;
    color:var(--rate-num-num) ;
}
 
 .modalbox  .page-rate-widget-box ,
 .modalbox  .page-rate-widget-box .rate-points::before {
    color:var(--rate-mobox-txt) ;
}
 
/* ----------- 单个著作信息框 ---------------- */
 
.creditRate .creditButtonStandalone p a{
  background: none;
    box-shadow: none;  
    text-decoration: none;
    font-size:0.8rem;
    top:0rem;
    left: -0.55rem;
    position: relative;
    width: 2rem;
}
 
.creditRate .creditButtonStandalone p:hover a:before{
    content: '';
 
}
 
.creditRate .creditButtonStandalone p a:hover{
    background: none;
}
 
.creditRate .creditButtonStandalone p:before{
content: '\f07b';
    font-family:FontAwesome;
    position: relative;
    top:0.5rem;
    font-size: 1.8rem;
}
 
.creditRate .creditButtonStandalone p:hover:before{
content: '\f07c';
}
 
/* ----------- 特殊 ---------------- */
 
/*
=====================================
正文元素
=====================================
*/
 
/* ----------- 表格 ------------ */
 
table.wiki-content-table th {
    background-color: #DADADA;
}
 
/* ----------- 目录（有空再弄） ------------ */
 
/*
#toc{
border: 2px dashed #888;
background-color: transparent;
    line-height:1.4rem;
 
    margin: 0 auto;
    position: relative;
}
*/
 
#page-content #toc-action-bar a {
     padding: 0;
}
 
#toc #toc-action-bar {
   text-align: center;
}
 
#toc{
padding: 0em 0em;
border: 0px solid var(--TOCbd-cl);
background-color: transparent;
display: table;
    line-height: var(--TOC-line-height);
     display: flex;
     flex-wrap: wrap;
     flex-basis: 100%;
     font-size: var(--TOC-txt-size);
 
    text-align: center;
    border-radius: 0rem 0.875rem;
    border-bottom: solid 0.2rem var(--TOCbd-cl);
    border-top: solid 0.2rem var(--TOCbd-cl);
    position: relative;
}
 
 #toc .title,
#toc-list,
#toc-action-bar{
     flex-basis: 100%;
    text-align: center;
}
 
#toc .title {
    visibility: hidden;
    margin-top: -1rem;
    padding: 0;
    position: relative;
    text-align: left;
 
}
 
#toc .title:before {
 content:var(--TOC-tt-txt,'目录') ;
    visibility: visible;
    padding: 0.2rem 0.4rem;
    background-color:var(--TOC-tt-bg);
    color:var(--TOC-tt-cl);
        border-radius: 0.5rem;
    border: 2px solid var(--TOCbd-cl);
}
 
#toc #toc-list div{
    margin: 0 !important;;
}
 
 #toc #toc-action-bar{
    order: 3;
    text-align: right ;
 
}
 
#toc  #toc-action-bar {
padding: 0;
    line-height: 0.5rem;
    position: relative;
    bottom: -0.5rem;
}
 
#toc-action-bar a{
    font-size:0;
    text-decoration: none;
}
 
#toc-action-bar a[onclick*="foldToc"]:before,
#toc-action-bar a[onclick*="unfoldToc"]:before{
    font-size: initial;
        padding: 0.2rem 0.4rem;
    font-family: var(--page-font);
    background-color:var(--TOC-tt-bg);
    color:var(--TOC-tt-cl);
        border-radius: 0.5rem;
    border: 2px solid var(--TOCbd-cl);  
}
 
#toc-action-bar a[onclick*="foldToc"]:before{
    content: var(--foldToc-txt);
}
 
#toc-action-bar a[onclick*="unfoldToc"]:before{
    content: var(--unfoldToc-txt);
}
 
#toc-action-bar a[onclick*="foldToc"]:hover:before,
#toc-action-bar a[onclick*="unfoldToc"]:hover:before{
    background:  var(--TOCbd-cl);
    color:var(--TOC-tt-bg);
}
 
/* ----------- 引用块 ------------ */
 
blockquote,
div.blockquote {
    border: 2px dashed var(--blockquote-border);
    padding:0.5rem 0.8rem;
    margin: 1rem 3em;
    background-color: var(--blockquote-bg222);
}
 
/* ----------- 替代引用块的div ------------ */
.mz-board,
.mz-blockquote {
    border: 3px double var(--blockquote-border);
        border-left: 5px solid var(--blockquote-border-left);
    padding:0.5rem 0.8rem;
    margin: 1rem 3em;
        background-size:80px;/* 20% */
    background-position: 0% 0%;
 background-repeat: repeat;
    background-color: transparent;
}
 
.mz-board:after,
.mz-blockquote:after {
    content: '\f06c ';
    font-family: 'FontAwesome';
    display: block;
    font-size: 1.2rem;
    width: 1rem;
    height:1rem;
    padding: 0.5rem;
    float: right;
 
    position: relative;
    margin-right: -1.5rem;
   margin-top:-1rem;
       background-color: var(--page-bg)
}
 
.mz-board:after,
.mz-blockquote div  .mz-blockquote:after,
.mz-blockquote div  .mz-blockquote:after {
    content: '\f02e ';
    font-family: 'FontAwesome';
    font-size: 1.2rem;
    background: none;
        margin-right: -1.5rem;
   margin-top:-0.5rem;
}
 
.mz-blockquote  .mz-blockquote  .mz-blockquote:after {
    display: none;
}
 
.mz-board{
    border: 2px solid #333;
    border-left: 7px solid #333;
    background: rgba(150,150,150,0.1);
}
 
.yui-content .mz-blockquote::after {
    background-color: var(--tabMain-bg);
}
 
.mz-tab-line .yui-content .mz-board::after,
.mz-tab-line .yui-content .mz-blockquote::after {
    background-color: var(--page-bg);
}
 
.mz-cover,
.mz-paper{
        border: 3.5px double #555;
        padding:0.5rem 1rem;
        margin: 1rem 1rem;
        background-size:100px;
        background-position: 0% 0%;
        background-repeat: repeat;
        background-color:var(--mz-paper-bg);
        background-image: var(--header-cover);
}
 
.mz-cover{
        border: 2px solid var(--color-navy);
        background-color:var(--color-kraft);
        background-image: var(--header-cover);
}
 
/**/
 
.mz-textquote {
    border-left: 5px #75878a solid;
    color: #75878a;
    padding:0px 0px 0px 1em;
    margin: 0.5em 1em;
}
 
.mz-textquote *:first-child{
    margin-top: 0.2rem ;
}
 
.mz-textquote *:last-child{
    margin-bottom: 0.2rem;
}
 
/*  引用块 与 div块 在手机格式下的边距  */
 
@media (max-width: 600px){
   blockquote, div.blockquote,
  .mz-paper,  .mz-blockquote,
  .mz-board, .mz-cover {  
    margin: 0.6rem 0.5rem;
      padding:0.5em 1em;
   }
}
 
/**/
 
/* ----------- 分割线 ------------ */
 
hr{
    margin: 1em 0em;
    padding-bottom: -1em;
    height: 0px;
    border-top: var(--color-hr) dashed 3.5px;
    color: transparent;
    background-color:  transparent;
}
 
.mz-hr{
    display: flex;
    flex-wrap: nowrap;
    flex-basis: 20%;
    width: 100%;
}
 
#side-bar hr{
        border-style: solid;
        border-width: 1px;
       border-color: var(--color-hr-sidebar);
}
 
/* 缩减  */
 
.mz-cover hr,
.yui-content hr,
.mz-board hr,
.mz-blockquote hr,
blockquote hr, div.blockquote hr {
    border-top: var(--color-hr) solid 2px;
    margin: 1em 1.5em;
}
 
.mz-tt.tt-box hr{
  margin: 0.5rem  1rem;
    border-top:1px solid var(--color-hr);
}
 
/* 分割线框  */
.mz-hr.hr-contract  hr{
         margin: 1em 2em;
        border-block-width: 1px;
 
}
 
.mz-hr.hr-solid hr{
               border-style: solid;
}
 
.mz-hr.hr-dotted hr{
           border-style: dotted;
}
 
.mz-hr hr{
    flex-basis: 20%;
    flex-grow: 1;
    top: 1rem;
    position: relative;
}
 
.mz-hr tt {
    flex-basis: 0%;
    font-size: 0rem;
}
 
.mz-hr  sub {
   font-size: inherit;
  position: relative;
top:0.3rem;
}
 
.mz-hr  tt:before {
    content: ' ';
margin: 1rem  0.8rem 0 0.8rem;
    font-size: 1.6rem;
      border-left:2px solid  var(--rate-info-border);
    position: relative;
    top: 0.2rem;
}
 
.mz-hr img{
    width: 2rem;
    margin: 0 1rem
}
 
/* 分割线窄屏 */
@media (max-width: 500px){
 
  hr{
    border-top: 2px dashed var(--color-hr);
 }
 
  .mz-hr{
    flex-wrap: nowrap;
  }
 
    .mz-hr .page-rate-widget-box{
    flex-shrink: 0;
  }
 
  .mz-hr p{
    flex-shrink: 1;
  }
     .mz-hr img{
    flex-shrink: 2;
  }
}
 
/* ----------- 插图  ---------------- */
 
/* 无框 */
.mz-img-wrap .scp-image-block {
    margin: 0 0.5rem;
}
 
.mz-img-wrap .scp-image-block {
    border: none;
    box-shadow: none;
}
 
.mz-img-wrap .scp-image-block .scp-image-caption {
    background-color: transparent;
    border-top: none;
    padding: 0.8rem 0;
    font-size: 100%;
    font-weight: normal;
    letter-spacing: 1px;
}
 
/* 图片有框  */
.mz-img-wrap.img-frame img{
    border: 3px double #333;
}
 
.mz-img-wrap.img-frame .scp-image-caption{
    display: flex;
    flex: 100%;
}
 
.mz-img-wrap.img-frame .scp-image-caption:after,
.mz-img-wrap.img-frame .scp-image-caption:before{
   content: "";
    margin: auto auto auto 0.375rem;
    color: var(--color-navy);
    border-top: 0px double var(--accentColor);
    flex-shrink: 0;
    font-size: 2rem;
    position: relative;
    display: inline-flex;
    flex-grow: 1;
    height: 1rem;
    background-color: var(--dark-accent);
    justify-content:  flex-start;
}
 
.mz-img-wrap.img-frame.img-border img{
        border: 2px dotted #333;
}
 
/* 模块外框 */
.mz-img-wrap.img-border .scp-image-block {
        overflow: hidden;        
    padding: 1rem;
      background: linear-gradient(-45deg,transparent 15px,var(--mz-img-bg) 0) bottom right,
              linear-gradient(45deg,transparent 15px,var(--mz-img-bg) 0) bottom left,
              linear-gradient(135deg,transparent 15px,var(--mz-img-bg) 0) top left,
              linear-gradient(-135deg,transparent 15px,var(--mz-img-bg) 0) top right;
  background-size: 50% 51%;
  background-repeat: no-repeat;
    position:  inherit;
    filter:var(--box-line);
 
}
 
.img-border.img-paper .scp-image-block {      
    background: linear-gradient(-45deg,transparent 15px,var(--mz-paper-bg222) 0) bottom right,
               linear-gradient(45deg,transparent 15px,var(--mz-paper-bg222) 0) bottom left,
               linear-gradient(135deg,transparent 15px,var(--mz-paper-bg222) 0) top left,
               linear-gradient(-135deg,transparent 15px,var(--mz-paper-bg222) 0) top right;
}
 
/* 3d 边框  */
 
.mz-img-wrap.img-b3d .scp-image-block {
    border: #999 5px ridge;
}
 
.mz-img-wrap.img-b3d .scp-image-block .scp-image-caption {
    border-top: solid 3px #666;
}
 
/* 额外适应  */
.mz-img-wrap.img-tt .scp-image-caption{
    font-family: var(--page-tt-font), serif;
    font-size: 150%;
    letter-spacing: 1px;
}
 
/* 弃用 */
.mz-imgbox-wrap{
    position: relative;
    margin: 0 auto;
    padding:0rem;
    margin: 1rem;
    padding: 1rem;
        margin: 0 auto;
    display: revert;
}
 
.mz-imgbox-wrap{
}
 
.mz-imgbox-txt{
    text-align: center;
}
 
/*
=====================================
更多效果
=====================================
*/
 
/* ----------- 内文标题  ------------ */
 
.mz-tt{
    text-align:center;
    margin: var(--ttbox-margin);
}
 
.mz-tt h1 span{
     padding: 0 1rem;
}
 
.mz-tt h1:before{
content: "";
flex-grow: 1;
height: 0.1rem;
margin: auto auto auto 0.375rem;
color: var(--accentColor);
background-color: var(--dark-accent);   
}
 
.mz-tt.tt-box h1:before,
.mz-tt.tt-box h1:after {
  flex-grow: 0;
  display: none;
}
 
.mz-tt.tt-box h1:before {
 content: "◥";
    display:block;
    color:var(--ttbox-before-color);
width: 0rem ;
    height: 0rem;
    position: absolute;
    font-size:var(--ttbox-before-size);
    margin-top:var(--ttbox-before-top);
    margin-left: var(--ttbox-before-left);
 
    z-index: -1;
}
 
.mz-tt.tt-box h1{
       height: 100%;
       background-color: transparent;
         display: block !important;
        text-align: left;
      letter-spacing: 0.1rem;
      font-size:var(--ttbox-h1-size);
}
 
.mz-tt.tt-box h1 span{
   background-color: var(--ttbox-h1-bg);
    border: solid var(--ttbox-border-size)  var(--ttbox-h1BDR-color);
    padding: var(--ttbox-padding);
     margin-left:  var(--ttbox-h1-left);
     position: relative;
    z-index: 0;
    color:  var(--ttbox-h1-color);
}
 
.mz-tt.tt-box h1 span span{
   background-color: var(--ttbox-h1-bg);
    border: none;
     position: relative;
    margin:0 calc(0rem - var(--ttbox-padding));
}
 
.mz-tt.tt-box {
       background-color: var(--ttbox-box-bg);
  border: solid var(--ttbox-box-size)  var(--ttbox-boxBDR-color);
    padding: 0rem 0 1rem 0;
   position: relative;
   padding: var(--ttbox-padding);
    text-align: left;
}
 
.mz-tt.tt-box  h1:first-of-type {
    display: block;
    position: absolute;
    top:var(--ttbox-h1-top);
    height: auto;
}
 
.tt-box p{  
    padding:inherit 0.5rem;
}
 
/* -----------横跨标题其二----------- */
 
.mz-tt222 {
    border-top: 3px solid #6d6b82;
    border-bottom: 3px solid #6d6b82;
    padding:0 0.5rem;
    margin: 1rem 3em;
 
}
 
#page-content  .mz-tt222 h1,.mz-tt222 h2, .mz-tt222 h3, .mz-tt222 h4{
    border-top: 1.5px solid #6d6b82;
    border-bottom: 1.5px solid #6d6b82;
    margin: 0.1rem;
    padding: 0.5rem;
    font-size: 160%;
    text-align: center;
display: block;
}
 
.mz-tt222 p{
    text-align: center;
}
 
/* -----------分栏----------- */
.mz-column p:first-of-type{
   margin: 0;  
}
 
.mz-column{
 
  -moz-column-count:2;
  -moz-column-rule:2px solid grey;
  -moz-column-gap:4rem;
 
  -webkit-column-count:2;     
  -webkit-column-rule:2px solid grey;
  -webkit-column-gap:4rem;
 
  column-count:2;     
  column-rule:2px solid grey;
  column-gap:4rem;
 
}
 
.mz-column.column-333{
      -moz-column-count:3;
      -webkit-column-count:3;    
      column-count:3;     
 
}
 
.mz-column.column-nip{
  -moz-column-rule:0px solid grey;
  -moz-column-gap:1.5rem;
 
   -webkit-column-rule:0px solid grey;
   -webkit-column-gap:1.5rem;
 
      column-rule:0px solid grey;
      column-gap:1.5rem;
}
 
.mz-column p:first-child{
  margin-top:0rem;
}
 
@media (max-width: 600px){
.mz-column{
  -moz-column-count:1;   
  -webkit-column-count:1;    
           column-count:1;    
  }
}
 
/*
=====================================
tab 分页
=====================================
*/
 
/* ---- YUI TAB BASE ---- */
.yui-navset {
 
    margin: 0 0.1rem;
}
 
.yui-navset .yui-nav a,.yui-navset .yui-navset-top .yui-nav a{
    background-color:inherit;
    background-image:inherit
}
 
.yui-navset .yui-nav a:hover,.yui-navset .yui-nav a:focus{
    background:inherit;
    text-decoration:inherit
}
 
.yui-navset .yui-nav .selected a,.yui-navset .yui-nav .selected a:focus,.yui-navset .yui-nav .selected a:hover{
    color:inherit;
    background:inherit;
}
 
.yui-navset .yui-nav,.yui-navset .yui-navset-top .yui-nav{
    border-color:inherit
}
 
.yui-navset li{
    line-height:inherit;
    min-width: 15%;   
}
 
/* ---- YUI TAB CUSTOMIZATION ----*/
 
 .yui-navset .yui-nav,
 .yui-navset .yui-navset-top .yui-nav{
     display: flex;
     flex-wrap: wrap;
    /* width: calc(100% - .05rem); */
     /*! margin: 0 auto; */
     border-color: var(--tabNAV-border);
     box-shadow: none;
}
 .yui-navset .yui-nav a, /* ---- Link Modifier ---- */
 .yui-navset .yui-navset-top .yui-nav a{
 
     font-weight: bold;
    /* ---- Tab Background Colour | [UNSELECTED] ---- */
     background-color: var(--tabNAV-bg);
     border: unset;
     box-shadow: none;
     box-shadow: none;
     transition: background-color 0.15s linear;
}
 .yui-navset .yui-nav a:hover,
 .yui-navset .yui-nav a:focus{
     color: #d6d6d6;
    /* ---- Tab Background Colour | [HOVER] ---- */
     background-color: var(--tabNAV-bgHover);
}
 .yui-navset .yui-nav li, /* ---- Listitem Modifier ---- */
 .yui-navset .yui-navset-top .yui-nav li{
     position: relative;
     display: flex;
     flex-grow: 2;
     max-width: 100%;
     margin: 0;
     padding: 0;
     color: #d6d6d6;
     border-color: transparent;
     box-shadow: none;
}
 .yui-navset .yui-nav li a,
 .yui-navset-top .yui-nav li a,
 .yui-navset-bottom .yui-nav li a{
     display: flex;
     align-items: center;
     justify-content: center;
     width: 100%;
}
 .yui-navset .yui-nav li em{
     border: unset;
}
 .yui-navset .yui-nav a em,
 .yui-navset .yui-navset-top .yui-nav a em{
     padding: .35em .75em;
 
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
}
 .yui-navset .yui-nav .selected, /* ---- Selection Modifier ---- */
 .yui-navset .yui-navset-top .yui-nav .selected{
     flex-grow: 2;
     margin: 0;
     padding: 0;
    /* ---- Tab Background Colour | [SELECTED] ---- */
     background-color: var(--tabNAV-bgSelect);
     color:var(--tabNAV-txtSelect);
}
 .yui-navset .yui-nav .selected a,
 .yui-navset .yui-nav .selected a em{
     border: none;
}
 .yui-navset .yui-nav .selected a{
     width: 100%;
     color: var(--tabNAV-txtSelect);
     font-weight: bold;
}
 .yui-navset .yui-nav .selected a:focus,
 .yui-navset .yui-nav .selected a:active{
     color:var(--tabNAV-txtACT);
     background-color: var(--tabNAV-bgAct);
}
 .yui-navset .yui-content {
    background-color:var(--tabMain-bg);
    box-shadow: none;
}
 .yui-navset .yui-content,
 .yui-navset .yui-navset-top .yui-content{
     padding: .5rem;
     margin: var(--tab-margin);
     border: var(--tabMain-border) solid 1px;
          border-top: var(--tabMain-border) solid 4px;
}
 
.yui-navset .yui-nav{
     border: none ;  
        /*! margin: 0 2px; */
          filter: drop-shadow(0px -1px 1px var(--tab-shadow));
}
 
.mz-tab .yui-navset{
     filter: drop-shadow(-1px 1px 0.5px var(--tab-shadow)) drop-shadow(1px 1px 0.5px var(--tab-shadow))
         drop-shadow(0px -1px 0.5px var(--tab-shadow)) drop-shadow(0px -1px 0.5px var(--tab-shadow) );
}
 
    /* ---------------- 翻页 ---------------- */
 
.mz-tab .yui-navset{
     filter: drop-shadow(-1px 0px 1px var(--tab-shadow)) drop-shadow(1px 1px 1px var(--tab-shadow));
}
 
.mz-tab  .yui-navset .yui-content {
    border: none;
    border-top: solid 4px var(--accentColor);
    color:  var(--tabMain-txt);
    background-color: var(--tabMain-bg);
 
    display: flex;
flex-wrap:wrap;
 
}
 
.mz-tab  .yui-navset .yui-content div[id*="wiki-tab"]{
    width: 100%;
    margin: 0 -0.2rem 0 -0.2rem;
    padding: 1rem;
}
 
.mz-tab  .yui-navset .yui-content:after{
     display: block;
    content: '  ';
    border: none;
    border-top: solid 0px transparent;
    padding:0rem 0;
     margin: 0;
    color: #ece3e3;
    width: 100%;
    height: 10rem;
           height:auto;
    background-color: var(--tabMain-bg);
 
 -webkit-mask-repeat: repeat-x;
         mask-repeat: repeat-x;
 -webkit-mask-size: 10rem;
         mask-size: 12rem;
    -webkit-mask-image:var(--img-chew444);
    mask-image:var(--img-chew444);
    -webkit-mask-position: bottom;
   mask-position:bottom;
     position: relative;
margin:0 0 -1rem 0;
    z-index: 1;
     top:0rem;
 
}
 
/**/
.mz-tab  .yui-content div[style*="display: none;"][id*="wiki-tab"]{
transform:rotateX(-180deg);    
    left: 0rem;
 
    position: absolute;
    opacity: 0;
    display: block !important;
    top:0%;
        transform-origin:  50% 0;  
height: 0;
    visibility:  hidden;
    border: 1px solid rgba(33,33,33,.8);
     border-top:0px solid rgba(33,33,33,0);
    background: #fffcf8;
    transition:   all 0s;
    height: 0 ;
 
   z-index: -0 !important;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
 
}
 
.mz-tab  .yui-content div[style*="display: block;"][id*="wiki-tab"]{
transform:rotateX(0deg);
        left: 0rem;
        position:     relative;
    top:0;
    transform-origin:  50% 0;   
z-index:0;
height: auto;
background:  var(--tabMain-bg);
    border: 1px solid rgba(33,33,33,0);
 
        transition:   all 1s;
transform-style: preserve-3d;
}
 
/* ---------------- 线条 ---------------- */
 
.mz-tab-line  .yui-navset .yui-nav{
    filter:none;
    background-color: var(--Line-tabNAV-border);  
    padding-left:var(--Line-tabBD-weight);
}
 
.mz-tab-line  .yui-navset .yui-nav li {
    margin-right:var(--Line-tabBD-weight);
}
 
.mz-tab-line .yui-navset .yui-nav a,
.mz-tab-line .yui-navset .yui-navset-top .yui-nav a{
     background-color: var(--Line-tabNAV-bg);
    border-top: var(--Line-tabBD-weight) solid var(--Line-tabNAV-border);  
    color: var(--Line-tabNAV-txt);
}
 
.mz-tab-line .yui-navset .yui-nav a:hover,
.mz-tab-line .yui-navset .yui-nav a:focus{
     background-color: var(--Line-tabNAV-bgHover);
}
 
.mz-tab-line .yui-navset .yui-nav .selected,
.mz-tab-line  .yui-navset .yui-navset-top .yui-nav .selected{
     background-color: var(--Line-tabNAV-bgSelect);
     color:var(--Line-tabNAV-txtSelect);
}
 
 .mz-tab-line .mz-line .yui-navset .yui-nav .selected a{
     color: var(--Line-tabNAV-txtSelect);
}
 .mz-tab-line .yui-navset .yui-nav .selected a:focus,
 .mz-tab-line .yui-navset .yui-nav .selected a:active{
     color:var(--Line-tabNAV-txtACT);
     background-color: var(--Line-tabNAV-bgAct);
}
 .mz-tab-line .yui-navset .yui-nav  a:hover,
 .mz-tab-line .yui-navset .yui-nav .selected a,
 .mz-tab-line .yui-navset .yui-nav .selected a:focus,
 .mz-tab-line .yui-navset .yui-nav .selected a:hover {
       color:var(--Line-tabNAV-txtHover);
     background-color: var(--Line-tabNAV-bgHover);
}
 
 .mz-tab-line .yui-navset .yui-nav .selected,
 .mz-tab-line .yui-navset .yui-navset-top .yui-nav .selected {
    background-color: var(--Line-tabNAV-bgSelect);
    color: var(--Line-tabNAV-txtSelect);
}
 
.mz-tab-line .yui-navset .yui-content {
    background-color:var(--Line-tabMain-bg);
}
 
.mz-tab-line .yui-navset .yui-content,
.mz-tab-line .yui-navset .yui-navset-top .yui-content{
     border: var(--Line-tabMain-border) solid var(--Line-tabBD-weight);
}
 
@media (max-width:520px){
  .mz-tab-line  .yui-navset .yui-nav{
    width:initial;
  }
}
 
/*
=====================================
标签
=====================================
*/
 
/*
=====================================
底栏
=====================================
*/
 
.page-tags a{
padding: 0.2rem 0.2rem;
    margin: 0 0.05rem;
}
 
.page-tags a:hover,
#page-options-container  a:hover{  
 color: var(--sidebar-link-hoverTXT);
 background-color: var(--sidebar-link-hoverBG);
    text-decoration: none;
}
 
/*
=====================================
其他
=====================================
*/
 
/* 内容居中左对齐 */
 
.lc-mid{
    display:  inline;
    width: auto;
        flex-shrink:0;
}
 
.lc-wrap{
    display:flex;
    align-items:center;
}
 
.lc-wrap:after,
.lc-wrap:before{
    align-items:center;
    flex-basis:100%;
    flex-shrink:2;
    content: ' ';
}
 
/* 内容居中左对齐 */
 
.indent-2{
    text-indent:2em;
}
 
/* 分割为二 */
.semibox-wrap {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: 0 auto;
    left: 2rem;
    position: relative;
}
 
.semibox-cell {
    width: 48%;
    justify-items: center;
}
 
@media (max-width: 700px) {
    .semibox-wrap {
        left: 0rem;
    }
    .semibox-cell {
        width: 100%;
    }
  }
}
 
.semibox-wrap + .mz-hr {
    padding:0.3rem 0;
}
 
/* ************** */
 
@media (max-width: 520px) {
.mob-hid{
 display:none;
}
}
 
/*
=====================================
调整组件
=====================================
*/
 
/* 浮动菜单 */
 
#u-float-memu #toc{
  word-break: keep-all;
   box-shadow: none;
    display: block;
    text-align:left;
}
 
#u-float-memu #toc .title {
    padding:0 1em;
    text-align: left;
}
 
#u-float-memu #toc .title:before {
 border: none;
    margin: 0;
}
 
#u-float-memu #toc-list{
    text-align:left;
    line-height: 1.5rem;
}
 
#u-float-memu #toc #toc-list div {
    margin: 0 1.5rem !important;
}
 
#u-float-memu  #toc #toc-list div:hover:before ,
#u-float-memu  #toc  #toc-list a::before {
    left: 0.6rem;
}
 
#u-float-memu .rate-btn {
    display: none;
}
 
#u-float-memu.memu-ch hr{
   border-top: 1px solid var(--color-hr);
    margin: 1em 2em ;
    min-width: 6rem;
}
 
.memu-ch {
    right: 0.8%;
}
 
#u-float-memu.memu-pg {
    background: var(--page-bg) ;
}
 
.fm-goto{
    padding-left: 1rem;
}
 
#u-float-memu #toc-list a:hover {
    background:var(--color-paleblue);
    color: var(--page-bg) ;
}
 
#u-float-memu a {
    color:var(--color-paleblue);
}
 
#u-float-memu #toc-list a {
    padding: 0rem 0.2rem;
    text-decoration: none;
}

/*
=====================================
杂志主题 - 可折叠侧边栏 - 22222222222222222
=====================================
*/
 
@import url("https://etinjat.wikidot.com/component:collapsible-sidebar/code/1");
 
:root{  
--body-width-on-desktop:60rem;
--sidebar-topBox-left:3.2rem;   
}
 
#main-content{
    margin-top: 0em;
}
 
#content-wrap{
     margin-left:0;
}
 
#main-content::after {
filter: sepia(50%) hue-rotate(150deg) saturate(150%);
}
 
#main-content {
    padding: 0;
    margin: 0 auto;
    left: 0;
    right: 0;
 
}
 
#content-wrap::after {
display: none;
}
 
#side-bar{
  z-index: 1;
  position: fixed;
  height: 100%;
opacity: 0;
}
 
#side-bar:hover, #side-bar:active {
      opacity: 1;
}
 
 #side-bar{
     margin-left:0;
     margin: 0;
     opacity: 0;
     position: fixed;
     padding-top:30px ;
       transition: left 1s;
}
 
#side-bar::before {
    position:  static;
    margin: 0 auto;
}
 
#side-bar:hover, #side-bar:active {
      opacity: 1;
           transition: all 0.5s;
     background-color: var(--sidebar-bg-pc);
 
}
 
div#extra-div-1 {
    z-index: 9;
}

/*
=====================================
    Magazine Theme - EN Version
=====================================
*/
 
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Yesteryear&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');
 
:root{
 
/* ----------- LOGO  ----------- */
 
    --logo-image:none;
 
/* ----------- TITLE ----------- */
--header-title: "FOUNDATION" ;
--mob-title:"Foundation";
--header-subtitle:"Secure, Contain, Protect";
--mob-subtitle:"Secure, Contain, Protect";
--sidebar-content:'Documents';
 
/* ----------- FONT ----------- */
    --page-font:'Roboto Slab', 'Markazi Text', '微软雅黑', '等线';
    --handwriting-font: 'Yesteryear', 'La Belle Aurore', sans-serif ;
 
    --page-tt-font:'DM Serif Display', 'Noto Serif SC';    
    --header-tt-font: 'Huiwen-mincho', 'DM Serif Display',  'Noto Serif SC';
    --mono-font:'Ubuntu Mono';
 
    --rate-font:'FontAwesome', 'Roboto Slab', 'DM Serif Display',  sans-serif ;
 
  /* ----------- ORTHER ----------- */
  --TOC-tt-txt:'MEMU';
     --foldToc-txt:'Fold';
      --unfoldToc-txt:'Unfold';
}
 
/*
-----------------------------------
BODY
-----------------------------------
*/
 
/* ----------- ACCOUNT ----------- */
 
#login-status #my-account {
        --trans-account:10deg;  
transform:rotate(var(--trans-account));
-ms-transform:rotate(var(--trans-account));
-moz-transform:rotate(var(--trans-account));     
-webkit-transform:rotate(var(--trans-account));
-o-transform:rotate(var(--trans-account));
}
 
/* ----------- SIDE BAR ----------- */
 
#side-bar div.side-block.side-block.media {
    padding:0 !important;
}
 
#side-bar div.side-block.side-block.media a img{
display: initial;
}
 
#side-bar .menu-item a[href="/"] {
    font-family: var(--page-tt-font),serif;
    font-size: 1.5rem;
    position: relative;
    left:30%;
}
 
#side-bar .side-block {
    padding-top: 0;
}
 
#side-bar .menu-item a[href="/"] {
    top: 0rem;
}
 
/* ----------- RATING ----------- */
#main-content .page-rate-widget-box  .rate-points {
    border-bottom: solid 2px var(--rate-num-border);
}
 
.page-rate-widget-box  .rate-points:after {
    padding: var(--rate-line-gap) 0rem 0 0rem;
}
 
.rate-points .number {
    padding: 0 var(--rate-num-padding) ;
    letter-spacing: 1px;
}
 
.page-rate-widget-box  .rate-points:before {
    content: '\f18e  Rating';
    font-size: 1rem;
    padding:  0 0.2rem 0 0.8rem;
    letter-spacing: 0.1rem;
}
 
.page-rate-widget-box:hover  .rate-points:before {
    content: '\f0ab  Rating';
}
 
.rateBox .creditButton p a {
    margin: 1rem 0 0 0.4rem;
   padding: 0rem 0.5rem;
    font-family: var(--mono-font);
}
 
.rateBox  .fa-info::before {
    content: " More \D\A  Info";
    white-space:pre;
    line-height: 1rem;
    padding: 0 ;
    left: -0.55rem;
    position:relative;
    font-weight: 600;
}
 
/* ----------- MEMU ----------- */
 
#toc #toc-list {
    margin: 0em 0 0 4em;
    text-align: left;
}
#toc  {
    width: 50%;
}

隐藏 移出鼠标 | 关闭

+ 进行评分

---

---

回到标题

跳至底部

介绍

该 sigma9 主题由 Etinjat 设计，灵感来自于 MalyceGraves 的报纸版式，而hoah2333 则调整了一些半月刊专属部分的代码。至于侧边栏的文书标志则由 Kcorena 绘制。

在你的作品开头添加如下语法以应用此版式：

[[include :scp-wiki-cn:theme:magazine]]

自定义选项：

[[include :scp-wiki-cn:theme:magazine
|collapsible-sidebar=true 启用可折叠侧边栏¹
|content-width= 正文区域宽度²
|header-title= '文本' 版头大标题文本，注意要用 '半角单引号' 框起来
|header-subtitle= '文本' 版头次标题文本
|mob-title= '文本' 窄屏（如移动端）版头大标题文本，不填默认同上³。
|mob-subtitle= '文本' 窄屏版头次标题文本，不填默认同上
|logo-image=url('地址') 版头标志，引号内填图片地址
|logo-sidebar=url('地址') 侧边栏标志
|sidebar-content='文本' 侧边栏标志下的文本
|title-orn-content='★' 正文标题下装饰线中的图形，可用 url('xxx') 替换 'xxx'
|title-orn-size=1.5rem 装饰图形大小
|title-orn-color=#542429 装饰图形颜色
|title-orn-width=2rem 装饰图形背景的宽度
]]

+ 更多自定义项目

[[module css]]

:root{
--header-cover: url(地址) 版头遮罩图片
--header-bg:rgb(185,137,102); 版头背景颜色
--header-tt-color:rgb(110, 100, 105); 版头大标题颜色
--header-subtt-color:#000; 版头次标题颜色

--logo-size:110px; 版头标志大小
--logo-position:50.2% 0%; 左右边距与上下边距
--logo-top:11px; 标志上边距偏移
--logo-opacity:0.2; 标志透明度
可在上述四项后面添加 -mob，以调整窄屏下的元素，例如调整手机下的标志大小：--logo-size-mob:110px;

--topbar-bg:rgb(20,21,39); 顶栏背景颜色
--topbar-txt:rgb(20,21,39); 顶栏链接颜色
}

[[/module]]

• PS：由于该版式用了许多计算程式，所以修改的东西涉及元素尺寸的数值时，请去修改 :root 里面的变量，且一律用 rem 作为单位。

常规

1 级标题

2 级标题

3 级标题

4 级标题

5 级标题

6 级标题

在一行字的起始处加上 1~6 个 “+ ”再接一个空格来创建标题样式。⁴

通常评分模组：

著作信息块：

著作信息

---

你页面的信息

---

著作信息

---

页面信息

---

更多

更多

---

更多页面信息

---

一个	表格
浏览过的链接	未浏览过的链接
空链接

+ 字体 / Font

中文

版头：汇文明朝⁵

标题：思源宋体

正文：思源黑体

手写：钟齐志莽行书

打字机：仿宋⁶

粗体 | 斜体 | 下划线 | 删除线 | 打字机 ^上标_下标

English

Header: Huiwen-mincho

Title: DM Serif Display

Body: Roboto Slab

Handwriting: Yesteryear

teletype: Ubuntu Mono

bold | italic | underline | strikethrough | teletype text ^superscript_subscript

To use EN font

Put the following:

[[include :scp-wiki-cn:theme:magazine
|font-en=true
]]

OR:

[[include :scp-wiki-cn:theme:magazine
|version-en=true
]]

+ 列表

• 无序列表
  • 列表
  • 列表

1. 有序列表
   1. 有序列表
   2. 有序列表

杂志图片

标准图片栏

• 在标准图片栏外部套上相应的 div，即可使用下方的特殊图片栏。

[[div class="mz-img-wrap " ]]
[[include component:image-block
name=
|width=
|caption=
|align=
]]
[[/div]]

杂志图片区
class="mz-img-wrap img-tt"⁷

杂志图片框
class="mz-img-wrap img-frame"

杂志图片板块
class="mz-img-wrap img-b3d"

杂志图片块
class="mz-img-wrap img-border"

杂志图片板块
class="mz-img-wrap img-border img-frame"

分割线

可通过五个连字符“-----”创建水平分割线：

---

特殊分割线

---

在分割线外套一个 div：

• 缩减线条尺寸：hr-contract
• 将线条变为实线：hr-solid
• 点线：hr-dotted

[[div class="mz-hr hr-contract hr-solid" ]]

------

[[/div]]

---

#

芜湖

#

---

#

在分割线侧边按任意顺序添加东西：

• 每个东西之间请空一行。
• 分割线可以重复添加。
• 注意请不要增添太多事物，以免窄屏下挤成一堆。

[[div class="mz-hr" ]]

[[image xxxx ]] 图片

------

{{#}} 竖线

芜湖 文本

[[module Rate]] 评分组件

[[/div]]

Theme Magazine

#

---

#

或者配合 ListPages 获取页面标题，
后隐藏原标题来产生某种效果。

[[module css]]
#page-title {
display: none;
}
[[/module]]

[[div class="pgtt-module mz-hr" ]]
[[module ListPages category="*" limit="1" fullname="="]]
%%title%%
[[/module]]
#
------
#
[[module Rate]]
[[/div]]

引用块

这是一个引用块，在一行字的起始处加上“> ”和一个空格来创建。

另一个引用块！

---

也可以用以下方法生成引用块：

[[div class="mz-cover"]]
mz-cover
[[/div]]blockquote！

替代引用块

[[div class="mz-blockquote"]]

mz-blockquote

[[/div]]

[[div class="mz-board" ]]

mz-board

[[/div]]

[[div class="mz-cover"]]

mz-cover

[[/div]]

[[div class="mz-paper"]]

mz-paper

[[/div]]

[[div class="mz-textquote"]]
mz-textquote
[[/div]]

综合效果

此处有龙

所谓半月刊，关键是半月刊需要如何写。 我认为， 史美尔斯说过一句著名的话，书籍把我们引入最美好的社会，使我们认识各个时代的伟大智者。带着这句话, 我们还要更加慎重的审视这个问题

从这个角度来看， 既然如何， 经过上述讨论， 我认为， 本人也是经过了深思熟虑，在每个日日夜夜思考这个问题。 这样看来， 我们一般认为，抓住了问题的关键，其他一切则会迎刃而解。

　半月刊，到底应该如何实现。 本人也是经过了深思熟虑，在每个日日夜夜思考这个问题。 经过上述讨论， 所谓半月刊，关键是半月刊需要如何写。 塞涅卡说过一句富有哲理的话，生命如同寓言，其价值不在与长短，而在与内容。这启发了我. 总结的来说， 既然如何， 每个人都不得不面对这些问题。

在面对这种问题时， 既然如何， 裴斯泰洛齐曾经说过，今天应做的事没有做，明天再早也是耽误了。这似乎解答了我的疑惑. 可是，即使是这样，半月刊的出现仍然代表了一定的意义。 既然如何， 所谓半月刊，关键是半月刊需要如何写。 俾斯麦曾经说过，对于不屈不挠的人来说，没有失败这回事。带着这句话, 我们还要更加慎重的审视这个问题: 半月刊，到底应该如何实现。

半月刊，到底应该如何实现。 从这个角度来看， 而这些并不是完全重要，更加重要的问题是， 而这些并不是完全重要，更加重要的问题是， 要想清楚，半月刊，到底是一种怎么样的存在。

---

_乱数文本

---

　　要想清楚，半月刊，到底是一种怎么样的存在。 每个人都不得不面对这些问题。 在面对这种问题时， 黑塞说过一句著名的话，有勇气承担命运这才是英雄好汉。这句话语虽然很短, 但令我浮想联翩

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

带着这些问题，我们来审视一下半月刊。 培根说过一句富有哲理的话，阅读使人充实，会谈使人敏捷，写作使人精确。这句话语虽然很短, 但令我浮想联翩. 现在，解决半月刊的问题，是非常非常重要的。

TAB 分页

分页

此为分页（tab view）。

自定义

• 插入到 include 的下方。

[[module CSS]]
:root{
--tabNAV-bgHover:#333;分页区背景颜色：鼠标移过/选择
--tabMain-border:#333; 框架颜色
}
[[/module]]

空 Tab

长 Tab

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

分页中的元素

分页中的标题

分页中的小标题

文本 — 链接

---

引用块

嵌套引用块

线型分页

分页

[[div class="mz-tab-line"]]
[[tabview]]
[[tab 分页]]

[[/tab]]
[[/tabview]]
[[/div]]

自定义

• 插入到 include 的下方。

[[module CSS]]
:root{
--Line-tab-base:#333; 框架颜色
--Line-tabNAV-txt:#333; 分页区文本颜色：未选择
--Line-tabNAV-txtHover:#e8e8e8; 分页区文本颜色：鼠标移过/选择
}

[[/module]]

空 Tab

长 Tab

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

分页中的元素

分页中的标题

分页中的小标题

文本 — 链接

---

引用块

嵌套引用块

翻页效果分页

分页

• 在第二次点击同一个分页时则出现翻页效果。

[[div class="mz-tab"]]
[[tabview]]
[[tab 分页]]

[[/tab]]
[[/tabview]]
[[/div]]

空 Tab

长 Tab

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

许多文本

分页中的元素

分页中的标题

分页中的小标题

文本 — 链接

---

引用块

嵌套引用块

横跨标题

○ 居中文本

横跨标题 其二

横跨标题样式（效果见上）

[[div class="mz-tt"]]
+ 横跨标题
○ 居中文本
[[/div]]

或

[[div class="mz-tt222"]]
+ 横跨标题其二
[[/div]]

伪黑光盒样式（效果即此）

[[div class="mz-tt tt-box" style="padding-top: 0rem"]] 通过调节 padding-top 来调整内文上方边距。
+ 大标题 务必放一个于开头

内文文本

+ 可再添加大标题

[[/div]]

调整盒子颜色

[[div class="mz-tt tt-box" style="padding-top: 0rem"]]
+ [[span style="background:#141527; color:#fff"]] 调整标题颜色 [[/span]]

内文文本

[[/div]]

更多调整：

[[module CSS]]
--ttbox-h1BDR-color: #333; 标题框颜色
--ttbox-boxBDR-color: #333; 盒子框颜色，不填默认同标题框颜色
--ttbox-before-color: #333; 折角颜色，不填默认同标题框颜色

--ttbox-h1-bg: #333; 标题背景色
--ttbox-h1-color: fff; 标题文本色

[[/module]]

分栏

以下代码可以将页面分为二或三栏，但在窄屏时会缩为一栏。

[[div class="mz-column"]]
分成两栏
[[/div]]

[[div class="mz-column column-333"]]
分成3栏
[[/div]]

[[div class="mz-column column-nip"]]
去掉之间线条
[[/div]]

[[div class="mz-column column-nip column-333"]]
分成三栏并去掉之间线条
[[/div]]

乱数文本：

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

一般来讲，我们都必须务必慎重的考虑考虑。 这样看来， 就我个人来说，半月刊对我的意义，不能不说非常重大。

带着这些问题，我们来审视一下半月刊。 培根说过一句富有哲理的话，阅读使人充实，会谈使人敏捷，写作使人精确。这句话语虽然很短, 但令我浮想联翩. 现在，解决半月刊的问题，是非常非常重要的。

不知为何这里有只羊

所以， 我们不得不面对一个非常尴尬的事实，那就是， 从这个角度来看， 从这个角度来看， 经过上述讨论， 半月刊的发生，到底需要如何做到，不半月刊的发生，又会如何产生。 一般来讲，我们都必须务必慎重的考虑考虑。 这样看来， 就我个人来说，半月刊对我的意义，不能不说非常重大。 一般来讲，我们都必须务必慎重的考虑考虑。 这样看来， 就我个人来说，半月刊对我的意义，不能不说非常重大。
　　
带着这些问题，我们来审视一下半月刊。 一般来说， 布尔沃说过一句富有哲理的话，要掌握书，莫被书掌握；要为生而读，莫为读而生。我希望诸位也能好好地体会这句话。**

---

环绕分栏

○ 无名氏

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

带着这些问题，我们来审视一下半月刊。 培根说过一句富有哲理的话，阅读使人充实，会谈使人敏捷，写作使人精确。这句话语虽然很短, 但令我浮想联翩. 现在，解决半月刊的问题，是非常非常重要的。

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

带着这些问题，我们来审视一下半月刊。 培根说过一句富有哲理的话，阅读使人充实，会谈使人敏捷，写作使人精确。这句话语虽然很短, 但令我浮想联翩. 现在，解决半月刊的问题，是非常非常重要的。

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

带着这些问题，我们来审视一下半月刊。 培根说过一句富有哲理的话，阅读使人充实，会谈使人敏捷，写作使人精确。这句话语虽然很短, 但令我浮想联翩. 现在，解决半月刊的问题，是非常非常重要的。

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

带着这些问题，我们来审视一下半月刊。 培根说过一句富有哲理的话，阅读使人充实，会谈使人敏捷，写作使人精确。这句话语虽然很短, 但令我浮想联翩. 现在，解决半月刊的问题，是非常非常重要的。

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

带着这些问题，我们来审视一下半月刊。 培根说过一句富有哲理的话，阅读使人充实，会谈使人敏捷，写作使人精确。这句话语虽然很短, 但令我浮想联翩. 现在，解决半月刊的问题，是非常非常重要的。

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

我们不得不面对一个非常尴尬的事实，那就是， 我认为， 我们都知道，只要有意义，那么就必须慎重考虑。 半月刊因何而发生？

带着这些问题，我们来审视一下半月刊。 培根说过一句富有哲理的话，阅读使人充实，会谈使人敏捷，写作使人精确。这句话语虽然很短, 但令我浮想联翩. 现在，解决半月刊的问题，是非常非常重要的。

---

环绕分栏代码

[[include :etinjat:css:column-start
|name=111 任意数字，若引用多个分栏又希望环绕部分尺寸不重复时，则此处不重复
|box-width=10rem 环绕部分固定宽度
|box-height=14rem 环绕部分固定高度
]]

环绕部分

[[include :etinjat:css:column-left]]

左侧文本

[[include :etinjat:css:column-right
|mid-style= 中间空白区域样式，可键入 border: none ; 来取消竖线。或者其他改变线条样式。
]]

右侧文本

[[include :etinjat:css:column-end]]

Footnotes

1. 用折叠侧边栏模块的同时，若调整正文区域宽度，可令其中轴与页面中轴保持一致。

2. 正文区域会向右延伸直至页面边界，不挤占侧边栏原本宽度。

3. 若把 mob 改成 pad，可以改变屏幕尺寸在 480px ~ 767px 间的大小标题。

4. 这里是脚注！

5. 该版式仅为这个字体嵌入页眉所用的文本和拉丁字母及部分符号，需要使用全部字型，请到该页面引用完整字体文件。

http://etinjat.wikidot.com/typeface-cn

6. 仅限安装有该字体的设备，不然，则显示标题字体。

7. img-tt 可不加，加了后改变字体字大