Emacs Org-mode 生成 HTML CSS 配置

--------------------------------------------------------------------------------
更新： DATE：2012.07.20
官网的CSS配置：
http://orgmode.org/org.cs
http://orgmode.org/worg/worg.css
王垠的CSS配置：yingwang0.css
薛瑞尼的CSS配置


--------------------------------------------------------------------------------

    一开始只是觉得Org官网的页面很酷（尤其是那个页面右上角的那个Table Of Contents），就很想知道它的CSS配置是什么?于是用Chrome的开发工具把它的所有CSS配置文件全部拷贝下来生成本地的CSS文件，然后Org-mode生成HTML的时候把CSS包含进去，结果很是出人意料……居然可行……效果官网的一模一样，比默认的好看多了

PS:下面是利用王垠的个人主页的CSS生成的效果

具体做法：把下面的代码拷贝到一个CSS文件中，例如style.css，然后在欲导出的org文件上面加上：#+STYLE: <link rel="stylesheet" type="text/css" href="../style/style.css" />其中../style/style.css是style.css文件相对于你现在所在的org文件相对路径（水木上有个帖子说不可用绝对路径，没有说原因，有知道的大神告我一声）

其中我知道的可以修改的：

第907行：http://orgmode.org/tmp/org-mode-unicorn.png是org-mode的logo：unicorn 独角兽，可以换成自己的图片，不过本人感觉这个图片在这儿挺不错的，毕竟是org官网的东西。

1195－1200行

        box-shadow: #333 3px 3px 4px;
-o-box-shadow: #333 3px 3px 4px;
-webkit-box-shadow: #333 3px 3px 4px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;

是我自己加的，覆盖了上面几行，你可以把它去掉看看效果（src和example环境下边框不会有阴影和圆角） 其实这个无所谓

最后1920-1926行

div#postamble {
margin: 20px 0px 20px 0px;
font-style: italic;
font-size: 11px;
font-family:"Courier New", Courier, monospace;
    background: white;
}

是用来控制最后Date Author块的，默认的比较难看

如果仔细看下就会发现下面的CSS控制的非常细腻，连最细微的东西都考虑到了（毕竟是官网） 

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 10000; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(http://orgmode.org/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(http://orgmode.org/images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 9000; width: 100%; height: 500px; background-color: #000; }


@media all
{
  body {
    margin: 10px 8% 10px 8%;
    font-family: Verdana;
    text-align: justify;
    font-size: 10pt;
    padding: 10px;
    line-height: 1.2em;
  }

  #table-of-contents {
    color: black;
    background: #FFF;
    font-size: 80%;
    padding: .5em;
    margin: 0em 0em 1em 1em;
    display: block;
  }

  #table-of-contents a  {
    color: #003333;
  }

  #table-of-contents a:hover {
    color: #003333;
    text-decoration: underline;
  }

  #table-of-contents li  {
    margin: .2em;
  }

  #table-of-contents h2 {
    margin-top: .2em;
    border: none;
  }

  #license {
    padding: .3em;
    border: 1px solid grey;
    background-color: #eeeeee;
    font-size: 80%;
  }

  h1 {
    font-size: 12pt;
  }

  .title {
    color: #990000;
    padding-bottom: 7px;
    margin-bottom: 20px;
    border-bottom: 1px solid #222;
  }

  h2 {
    font-size: 12pt;
    padding-bottom: 4px;
    margin-bottom: 5px;
    border-bottom: 3px solid #DDD;
  }

  h3 {
    font-size: 11pt;
    color: #333333;
  }

  h4 {
    font-size: 9pt;
  }

  a {
    text-decoration: none;
    color: #006666
  }

  a:visited {
    text-decoration: none;
    color: #336666
  }

  a:hover {
    text-decoration: underline;
    color: #003333
  }

  .todo {
    color: #990000;
  }

  .done {
    color: #006666;
  }

  .timestamp-kwd {
    color: #444;
  }

  .tag {
    color: #DDD;
    font-size: 70%;
    font-weight: 500;
  }

  li {
    margin: .4em;
  }

  table {
    border: none;
  }

  td {
    border: none;
    padding: .1em .7em .1em .3em;
  }

  th {
    border: none;
  }

  code {
    font-size: 100%;
  }

  img {
    border: none;
  }

  .share img {
    opacity: .4;
    -moz-opacity: .4;
    filter: alpha(opacity=40);
  }

  .share img:hover {
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
  }

  /* pre {border: 1px solid #555; */
  /*      background: #EEE; */
  /*      font-size: 9pt; */
  /*      padding: 1em; */
  /*     } */

  /* pre { */
  /*     color: #e5e5e5; */
  /*     background-color: #000000; */
  /*     padding: 1.4em; */
  /*     border: 2px solid grey; */
  /* } */

  pre {
      background-color: black;
      border: 4px solid grey;
      color: #EEE;
      overflow: auto;
      padding: 1em;
   }

  .org-info-box {
    clear:both;
    margin-left:auto;
    margin-right:auto;
    padding:0.7em;
    /* border:1px solid #CCC; */
    /* border-radius:10px; */
    /* -moz-border-radius:10px; */
  }
  .org-info-box img {
    float:left;
    margin:0em 0.5em 0em 0em;
  }
  .org-info-box p {
    margin:0em;
    padding:0em;
  }


  .builtin {
    /* font-lock-builtin-face */
    color: #f4a460;
  }
  .comment {
    /* font-lock-comment-face */
    color: #737373;
  }
  .comment-delimiter {
    /* font-lock-comment-delimiter-face */
    color: #666666;
  }
  .constant {
    /* font-lock-constant-face */
    color: #db7093;
  }
  .doc {
    /* font-lock-doc-face */
    color: #b3b3b3;
  }
  .function-name {
    /* font-lock-function-name-face */
    color: #5f9ea0;
  }
  .headline {
    /* headline-face */
    color: #ffffff;
    background-color: #000000;
    font-weight: bold;
  }
  .keyword {
    /* font-lock-keyword-face */
    color: #4682b4;
  }
  .negation-char {
  }
  .regexp-grouping-backslash {
  }
  .regexp-grouping-construct {
  }
  .string {
    /* font-lock-string-face */
    color: #ccc79a;
  }
  .todo-comment {
    /* todo-comment-face */
    color: #ffffff;
    background-color: #000000;
    font-weight: bold;
  }
  .variable-name {
    /* font-lock-variable-name-face */
    color: #ff6a6a;
  }
  .warning {
    /* font-lock-warning-face */
    color: #ffffff;
    background-color: #cd5c5c;
    font-weight: bold;
  }
  pre.a {
    color: inherit;
    background-color: inherit;
    font: inherit;
    text-decoration: inherit;
  }
  pre.a:hover {
    text-decoration: underline;
  }

  /* Styles for org-info.js */

  .org-info-js_info-navigation
  {
    border-style:none;
  }

  #org-info-js_console-label
  {
    font-size:10px;
    font-weight:bold;
    white-space:nowrap;
  }

  .org-info-js_search-highlight
  {
    background-color:#ffff00;
    color:#000000;
    font-weight:bold;
  }

  #org-info-js-window
  {
    border-bottom:1px solid black;
    padding-bottom:10px;
    margin-bottom:10px;
  }



  .org-info-search-highlight
  {
    background-color:#adefef; /* same color as emacs default */
    color:#000000;
    font-weight:bold;
  }

  .org-bbdb-company {
    /* bbdb-company */
    font-style: italic;
  }
  .org-bbdb-field-name {
  }
  .org-bbdb-field-value {
  }
  .org-bbdb-name {
    /* bbdb-name */
    text-decoration: underline;
  }
  .org-bold {
    /* bold */
    font-weight: bold;
  }
  .org-bold-italic {
    /* bold-italic */
    font-weight: bold;
    font-style: italic;
  }
  .org-border {
    /* border */
    background-color: #000000;
  }
  .org-buffer-menu-buffer {
    /* buffer-menu-buffer */
    font-weight: bold;
  }
  .org-builtin {
    /* font-lock-builtin-face */
    color: #da70d6;
  }
  .org-button {
    /* button */
    text-decoration: underline;
  }
  .org-c-nonbreakable-space {
    /* c-nonbreakable-space-face */
    background-color: #ff0000;
    font-weight: bold;
  }
  .org-calendar-today {
    /* calendar-today */
    text-decoration: underline;
  }
  .org-comment {
    /* font-lock-comment-face */
    color: #b22222;
  }
  .org-comment-delimiter {
    /* font-lock-comment-delimiter-face */
    color: #b22222;
  }
  .org-constant {
    /* font-lock-constant-face */
    color: #5f9ea0;
  }
  .org-cursor {
    /* cursor */
    background-color: #000000;
  }
  .org-default {
    /* default */
    color: #000000;
    background-color: #ffffff;
  }
  .org-diary {
    /* diary */
    color: #ff0000;
  }
  .org-doc {
    /* font-lock-doc-face */
    color: #bc8f8f;
  }
  .org-escape-glyph {
    /* escape-glyph */
    color: #a52a2a;
  }
  .org-file-name-shadow {
    /* file-name-shadow */
    color: #7f7f7f;
  }
  .org-fixed-pitch {
  }
  .org-fringe {
    /* fringe */
    background-color: #f2f2f2;
  }
  .org-function-name {
    /* font-lock-function-name-face */
    color: #0000ff;
  }
  .org-header-line {
    /* header-line */
    color: #333333;
    background-color: #e5e5e5;
  }
  .org-help-argument-name {
    /* help-argument-name */
    font-style: italic;
  }
  .org-highlight {
    /* highlight */
    background-color: #b4eeb4;
  }
  .org-holiday {
    /* holiday */
    background-color: #ffc0cb;
  }
  .org-info-header-node {
    /* info-header-node */
    color: #a52a2a;
    font-weight: bold;
    font-style: italic;
  }
  .org-info-header-xref {
    /* info-header-xref */
    color: #0000ff;
    text-decoration: underline;
  }
  .org-info-menu-header {
    /* info-menu-header */
    font-weight: bold;
  }
  .org-info-menu-star {
    /* info-menu-star */
    color: #ff0000;
  }
  .org-info-node {
    /* info-node */
    color: #a52a2a;
    font-weight: bold;
    font-style: italic;
  }
  .org-info-title-1 {
    /* info-title-1 */
    font-size: 172%;
    font-weight: bold;
  }
  .org-info-title-2 {
    /* info-title-2 */
    font-size: 144%;
    font-weight: bold;
  }
  .org-info-title-3 {
    /* info-title-3 */
    font-size: 120%;
    font-weight: bold;
  }
  .org-info-title-4 {
    /* info-title-4 */
    font-weight: bold;
  }
  .org-info-xref {
    /* info-xref */
    color: #0000ff;
    text-decoration: underline;
  }
  .org-isearch {
    /* isearch */
    color: #b0e2ff;
    background-color: #cd00cd;
  }
  .org-italic {
    /* italic */
    font-style: italic;
  }
  .org-keyword {
    /* font-lock-keyword-face */
    color: #a020f0;
  }
  .org-lazy-highlight {
    /* lazy-highlight */
    background-color: #afeeee;
  }
  .org-link {
    /* link */
    color: #0000ff;
    text-decoration: underline;
  }
  .org-link-visited {
    /* link-visited */
    color: #8b008b;
    text-decoration: underline;
  }
  .org-match {
    /* match */
    background-color: #ffff00;
  }
  .org-menu {
  }
  .org-message-cited-text {
    /* message-cited-text */
    color: #ff0000;
  }
  .org-message-header-cc {
    /* message-header-cc */
    color: #191970;
  }
  .org-message-header-name {
    /* message-header-name */
    color: #6495ed;
  }
  .org-message-header-newsgroups {
    /* message-header-newsgroups */
    color: #00008b;
    font-weight: bold;
    font-style: italic;
  }
  .org-message-header-other {
    /* message-header-other */
    color: #4682b4;
  }
  .org-message-header-subject {
    /* message-header-subject */
    color: #000080;
    font-weight: bold;
  }
  .org-message-header-to {
    /* message-header-to */
    color: #191970;
    font-weight: bold;
  }
  .org-message-header-xheader {
    /* message-header-xheader */
    color: #0000ff;
  }
  .org-message-mml {
    /* message-mml */
    color: #228b22;
  }
  .org-message-separator {
    /* message-separator */
    color: #a52a2a;
  }
  .org-minibuffer-prompt {
    /* minibuffer-prompt */
    color: #0000cd;
  }
  .org-mm-uu-extract {
    /* mm-uu-extract */
    color: #006400;
    background-color: #ffffe0;
  }
  .org-mode-line {
    /* mode-line */
    color: #000000;
    background-color: #bfbfbf;
  }
  .org-mode-line-buffer-id {
    /* mode-line-buffer-id */
    font-weight: bold;
  }
  .org-mode-line-highlight {
  }
  .org-mode-line-inactive {
    /* mode-line-inactive */
    color: #333333;
    background-color: #e5e5e5;
  }
  .org-mouse {
    /* mouse */
    background-color: #000000;
  }
  .org-negation-char {
  }
  .org-next-error {
    /* next-error */
    background-color: #eedc82;
  }
  .org-nobreak-space {
    /* nobreak-space */
    color: #a52a2a;
    text-decoration: underline;
  }
  .org-org-agenda-date {
    /* org-agenda-date */
    color: #0000ff;
  }
  .org-org-agenda-date-weekend {
    /* org-agenda-date-weekend */
    color: #0000ff;
    font-weight: bold;
  }
  .org-org-agenda-restriction-lock {
    /* org-agenda-restriction-lock */
    background-color: #ffff00;
  }
  .org-org-agenda-structure {
    /* org-agenda-structure */
    color: #0000ff;
  }
  .org-org-archived {
    /* org-archived */
    color: #7f7f7f;
  }
  .org-org-code {
    /* org-code */
    color: #7f7f7f;
  }
  .org-org-column {
    /* org-column */
    background-color: #e5e5e5;
  }
  .org-org-column-title {
    /* org-column-title */
    background-color: #e5e5e5;
    font-weight: bold;
    text-decoration: underline;
  }
  .org-org-date {
    /* org-date */
    color: #a020f0;
    text-decoration: underline;
  }
  .org-org-done {
    /* org-done */
    color: #228b22;
    font-weight: bold;
  }
  .org-org-drawer {
    /* org-drawer */
    color: #0000ff;
  }
  .org-org-ellipsis {
    /* org-ellipsis */
    color: #b8860b;
    text-decoration: underline;
  }
  .org-org-formula {
    /* org-formula */
    color: #b22222;
  }
  .org-org-headline-done {
    /* org-headline-done */
    color: #bc8f8f;
  }
  .org-org-hide {
    /* org-hide */
    color: #e5e5e5;
  }
  .org-org-latex-and-export-specials {
    /* org-latex-and-export-specials */
    color: #8b4513;
  }
  .org-org-level-1 {
    /* org-level-1 */
    color: #0000ff;
  }
  .org-org-level-2 {
    /* org-level-2 */
    color: #b8860b;
  }
  .org-org-level-3 {
    /* org-level-3 */
    color: #a020f0;
  }
  .org-org-level-4 {
    /* org-level-4 */
    color: #b22222;
  }
  .org-org-level-5 {
    /* org-level-5 */
    color: #228b22;
  }
  .org-org-level-6 {
    /* org-level-6 */
    color: #5f9ea0;
  }
  .org-org-level-7 {
    /* org-level-7 */
    color: #da70d6;
  }
  .org-org-level-8 {
    /* org-level-8 */
    color: #bc8f8f;
  }
  .org-org-link {
    /* org-link */
    color: #a020f0;
    text-decoration: underline;
  }
  .org-org-property-value {
  }
  .org-org-scheduled-previously {
    /* org-scheduled-previously */
    color: #b22222;
  }
  .org-org-scheduled-today {
    /* org-scheduled-today */
    color: #006400;
  }
  .org-org-sexp-date {
    /* org-sexp-date */
    color: #a020f0;
  }
  .org-org-special-keyword {
    /* org-special-keyword */
    color: #bc8f8f;
  }
  .org-org-table {
    /* org-table */
    color: #0000ff;
  }
  .org-org-tag {
    /* org-tag */
    font-weight: bold;
  }
  .org-org-target {
    /* org-target */
    text-decoration: underline;
  }
  .org-org-time-grid {
    /* org-time-grid */
    color: #b8860b;
  }
  .org-org-todo {
    /* org-todo */
    color: #ff0000;
  }
  .org-org-upcoming-deadline {
    /* org-upcoming-deadline */
    color: #b22222;
  }
  .org-org-verbatim {
    /* org-verbatim */
    color: #7f7f7f;
    text-decoration: underline;
  }
  .org-org-warning {
    /* org-warning */
    color: #ff0000;
    font-weight: bold;
  }
  .org-outline-1 {
    /* outline-1 */
    color: #0000ff;
  }
  .org-outline-2 {
    /* outline-2 */
    color: #b8860b;
  }
  .org-outline-3 {
    /* outline-3 */
    color: #a020f0;
  }
  .org-outline-4 {
    /* outline-4 */
    color: #b22222;
  }
  .org-outline-5 {
    /* outline-5 */
    color: #228b22;
  }
  .org-outline-6 {
    /* outline-6 */
    color: #5f9ea0;
  }
  .org-outline-7 {
    /* outline-7 */
    color: #da70d6;
  }
  .org-outline-8 {
    /* outline-8 */
    color: #bc8f8f;
  }
  .outline-text-1, .outline-text-2, .outline-text-3, .outline-text-4, .outline-text-5, .outline-text-6 {
    /* Add more spacing between section. Padding, so that folding with org-info.js works as expected. */
    padding-bottom:2em;
  }
  .org-preprocessor {
    /* font-lock-preprocessor-face */
    color: #da70d6;
  }
  .org-query-replace {
    /* query-replace */
    color: #b0e2ff;
    background-color: #cd00cd;
  }
  .org-regexp-grouping-backslash {
    /* font-lock-regexp-grouping-backslash */
    font-weight: bold;
  }
  .org-regexp-grouping-construct {
    /* font-lock-regexp-grouping-construct */
    font-weight: bold;
  }
  .org-region {
    /* region */
    background-color: #eedc82;
  }
  .org-rmail-highlight {
  }
  .org-scroll-bar {
    /* scroll-bar */
    background-color: #bfbfbf;
  }
  .org-secondary-selection {
    /* secondary-selection */
    background-color: #ffff00;
  }
  .org-shadow {
    /* shadow */
    color: #7f7f7f;
  }
  .org-show-paren-match {
    /* show-paren-match */
    background-color: #40e0d0;
  }
  .org-show-paren-mismatch {
    /* show-paren-mismatch */
    color: #ffffff;
    background-color: #a020f0;
  }
  .org-string {
    /* font-lock-string-face */
    color: #bc8f8f;
  }
  .org-texinfo-heading {
    /* texinfo-heading */
    color: #0000ff;
  }
  .org-tool-bar {
    /* tool-bar */
    color: #000000;
    background-color: #bfbfbf;
  }
  .org-tooltip {
    /* tooltip */
    color: #000000;
    background-color: #ffffe0;
  }
  .org-trailing-whitespace {
    /* trailing-whitespace */
    background-color: #ff0000;
  }
  .org-type {
    /* font-lock-type-face */
    color: #228b22;
  }
  .org-underline {
    /* underline */
    text-decoration: underline;
  }
  .org-variable-name {
    /* font-lock-variable-name-face */
    color: #b8860b;
  }
  .org-variable-pitch {
  }
  .org-vertical-border {
  }
  .org-warning {
    /* font-lock-warning-face */
    color: #ff0000;
    font-weight: bold;
  }
  .rss_box {}
  .rss_title, rss_title a {}
  .rss_items {}
  .rss_item a:link, .rss_item a:visited, .rss_item a:active {}
  .rss_item a:hover {}
  .rss_date {}

} /* END OF @media all */



@media screen
{
  #table-of-contents {
    float: right;
    border: 1px solid #CCC;
    max-width: 50%;
    overflow: auto;
  }
} /* END OF @media screen */

@media all
{
  @import url(/worg/style/zenburn-emacs.css);
  body {
    color: #dcdccc;
    background-color: white;
    font:0.9em serif;
    max-width: 95%;
    margin: auto;
    background-image: url(http://orgmode.org/tmp/org-mode-unicorn.png);
    background-repeat: no-repeat;
    }
    body #content {
      padding-top: 45px;
    }
    body pre {
      border: none; }
    body a {
      color: #8cd0d3; }
    body #content {
      padding-top: 100px; }
    body .title {
      margin-left: 120px;
    }

  /* TOC inspired by http://jashkenas.github.com/coffee-script */
  #table-of-contents {
    font-size: 10pt;
    position: fixed;
    right: 0em;
    top: 0em;
    background: #2b2b2b;
    color: #dcdccc;
    -webkit-box-shadow: 0 0 1em #777777;
    -moz-box-shadow: 0 0 1em #777777;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    text-align: right;
    /* ensure doesn't flow off the screen when expanded */
    max-height: 80%;
    overflow: auto; }
    #table-of-contents h2 {
      font-size: 10pt;
      max-width: 8em;
      font-weight: normal;
      padding-left: 0.5em;
      padding-left: 0.5em;
      padding-top: 0.05em;
      padding-bottom: 0.05em; }
    #table-of-contents #text-table-of-contents {
      display: none;
      text-align: left; }
    #table-of-contents:hover #text-table-of-contents {
      display: block;
      padding: 0.5em;
      margin-top: -1.5em; }
    
  .rss_box {}
  .rss_title, rss_title a {}
  .rss_items {}
  .rss_item a:link, .rss_item a:visited, .rss_item a:active {}
  .rss_item a:hover {}
  .rss_date {}

} /* END OF @media all */

@media screen
{
  #table-of-contents {
    float: right;
    border: 1px solid #CCC;
    max-width: 50%;
    overflow: auto;
  }
} /* END OF @media screen */

@media all
{
  body {
    font-family: "Helvetica Neue", "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif !important;
    font-size: 14px;
    line-height: 21px;
    color: #333;

    max-width: 95%;
    margin: auto;
    background-image: url(http://orgmode.org/worg-unicorn.png);
    background-position: 25px 5px;
    background-repeat: no-repeat;
    }
    body #content {
      padding-top: 70px;
    }
    body .title {
      margin-left: 120px;
    }

  #org-div-home-and-up{
      position: fixed;
      right: 0;
      top: 4em;
  }

  /* TOC inspired by http://jashkenas.github.com/coffee-script */
  #table-of-contents {
    font-size: 10pt;
    position: fixed;
    right: 0em;
    top: 0em;
    background: white;
    -webkit-box-shadow: 0 0 1em #777777;
    -moz-box-shadow: 0 0 1em #777777;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    text-align: right;
    /* ensure doesn't flow off the screen when expanded */
    max-height: 80%;
    overflow: auto; }
    #table-of-contents h2 {
      font-size: 10pt;
      max-width: 9em;
      font-weight: normal;
      padding-left: 0.5em;
      padding-left: 0.5em;
      padding-top: 0.05em;
      padding-bottom: 0.05em; }
    #table-of-contents #text-table-of-contents {
      display: none;
      text-align: left; }
    #table-of-contents:hover #text-table-of-contents {
      display: block;
      padding: 0.5em;
      margin-top: -1.5em; }

  /* #license { */
  /*   padding: .3em; */
  /*   border: 1px solid gray; */
  /*   background-color: #eeeeee; */
  /* } */

  h1 {
/*
    font-family:Sans;
    font-weight:bold; */
    font-size:2.1em;
    padding:0 0 30px 0;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-right: 7%;
    color: #6C5D4F;
  }

/*
  h2:before {
    content: "* "
  }

  h3:before {
    content: "** "
  }

  h4:before {
    content: "*** "
  }
*/

  h2 {
    font-family:Arial,sans-serif;
    font-size:1.45em;
    line-height:16px;
    padding:7px 0 0 0;
    color: #6E2432;
  }

  .outline-text-2 {
    margin-left: 0.1em
  }

  .title {

  }

  h3 {
    font-family:Arial,sans-serif;
    font-size:1.3em;
    color: #A34D32;
    margin-left: 0.6em;
  }

  .outline-text-3 {
    margin-left: 0.9em;
  }

  h4 {
    font-family:Arial,sans-serif;
    font-size:1.2em;
    margin-left: 1.2em;
    color: #A5573E;
  }

  .outline-text-4 {
    margin-left: 1.45em;
  }

  a {text-decoration: none; color: #537d7b}
  /* a:visited {text-decoration: none; color: #224444} */ /* Taken out because color too similar to text. */
  a:visited {text-decoration: none; color: #98855b}  /* this is now the color of the Unicorns horn */
  a:hover {text-decoration: underline; color: #a34d32}

  .todo {
    color: #CA0000;
  }

  .done {
    color: #006666;
  }

  .timestamp-kwd {
    color: #444;
  }

  .tag {

  }

  li {
    margin: .4em;
  }

  table {
    border: none;
  }

  td {
    border: none;
  }

  th {
    border: none;
  }

  code {
    font-size: 100%;
    color: black;
    border: 1px solid #DEDEDE;
    padding: 0px 0.2em;
  }

  img {
    border: none;
  }

  .share img {
    opacity: .4;
    -moz-opacity: .4;
    filter: alpha(opacity=40);
  }

  .share img:hover {
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
  }

  /* pre {border: 1px solid #555; */
  /*      background: #EEE; */
  /*      font-size: 9pt; */
  /*      padding: 1em; */
  /*     } */

  /* pre { */
  /*     color: #e5e5e5; */
  /*     background-color: #000000; */
  /*     padding: 1.4em; */
  /*     border: 2px solid gray; */
  /* } */

  /* pre { */
  /*     background-color: #2b2b2b; */
  /*     border: 4px solid gray; */
  /*     color: #EEE; */
  /*     overflow: auto; */
  /*     padding: 1em; */
  /*  } */

  pre {
    font-family: Monaco, Consolas, "Lucida Console", monospace;
    color: black;
    background-color: #efefef;
    padding: 1.2em;
    border: 1px solid #dddddd;
    overflow: auto;

    -webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.23);
    -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.23);
    box-shadow: 0px 0px 4px rgba(0,0,0,0.23);

	box-shadow: #333 3px 3px 4px;
	-o-box-shadow: #333 3px 3px 4px;
	-webkit-box-shadow: #333 3px 3px 4px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
  }

  .org-info-box {
    clear:both;
    margin-left:auto;
    margin-right:auto;
    padding:0.7em;
    /* border:1px solid #CCC; */
    /* border-radius:10px; */
    /* -moz-border-radius:10px; */
  }
  .org-info-box img {
    float:left;
    margin:0em 0.5em 0em 0em;
  }
  .org-info-box p {
    margin:0em;
    padding:0em;
  }


  .builtin {
    /* font-lock-builtin-face */
    color: #f4a460;
  }
  .comment {
    /* font-lock-comment-face */
    color: #737373;
  }
  .comment-delimiter {
    /* font-lock-comment-delimiter-face */
    color: #666666;
  }
  .constant {
    /* font-lock-constant-face */
    color: #db7093;
  }
  .doc {
    /* font-lock-doc-face */
    color: #b3b3b3;
  }
  .function-name {
    /* font-lock-function-name-face */
    color: #5f9ea0;
  }
  .headline {
    /* headline-face */
    color: #ffffff;
    background-color: #000000;
    font-weight: bold;
  }
  .keyword {
    /* font-lock-keyword-face */
    color: #4682b4;
  }
  .negation-char {
  }
  .regexp-grouping-backslash {
  }
  .regexp-grouping-construct {
  }
  .string {
    /* font-lock-string-face */
    color: #ccc79a;
  }
  .todo-comment {
    /* todo-comment-face */
    color: #ffffff;
    background-color: #000000;
    font-weight: bold;
  }
  .variable-name {
    /* font-lock-variable-name-face */
    color: #ff6a6a;
  }
  .warning {
    /* font-lock-warning-face */
    color: #ffffff;
    background-color: #cd5c5c;
    font-weight: bold;
  }
  pre.a {
    color: inherit;
    background-color: inherit;
    font: inherit;
    text-decoration: inherit;
  }
  pre.a:hover {
    text-decoration: underline;
  }

  /* Styles for org-info.js */

  .org-info-js_info-navigation
  {
    border-style:none;
  }

  #org-info-js_console-label
  {
    font-size:10px;
    font-weight:bold;
    white-space:nowrap;
  }

  .org-info-js_search-highlight
  {
    background-color:#ffff00;
    color:#000000;
    font-weight:bold;
  }

  #org-info-js-window
  {
    border-bottom:1px solid black;
    padding-bottom:10px;
    margin-bottom:10px;
  }



  .org-info-search-highlight
  {
    background-color:#adefef; /* same color as emacs default */
    color:#000000;
    font-weight:bold;
  }

  .org-bbdb-company {
    /* bbdb-company */
    font-style: italic;
  }
  .org-bbdb-field-name {
  }
  .org-bbdb-field-value {
  }
  .org-bbdb-name {
    /* bbdb-name */
    text-decoration: underline;
  }
  .org-bold {
    /* bold */
    font-weight: bold;
  }
  .org-bold-italic {
    /* bold-italic */
    font-weight: bold;
    font-style: italic;
  }
  .org-border {
    /* border */
    background-color: #000000;
  }
  .org-buffer-menu-buffer {
    /* buffer-menu-buffer */
    font-weight: bold;
  }
  .org-builtin {
    /* font-lock-builtin-face */
    color: #da70d6;
  }
  .org-button {
    /* button */
    text-decoration: underline;
  }
  .org-c-nonbreakable-space {
    /* c-nonbreakable-space-face */
    background-color: #ff0000;
    font-weight: bold;
  }
  .org-calendar-today {
    /* calendar-today */
    text-decoration: underline;
  }
  .org-comment {
    /* font-lock-comment-face */
    color: #b22222;
  }
  .org-comment-delimiter {
    /* font-lock-comment-delimiter-face */
    color: #b22222;
  }
  .org-constant {
    /* font-lock-constant-face */
    color: #5f9ea0;
  }
  .org-cursor {
    /* cursor */
    background-color: #000000;
  }
  .org-default {
    /* default */
    color: #000000;
    background-color: #ffffff;
  }
  .org-diary {
    /* diary */
    color: #ff0000;
  }
  .org-doc {
    /* font-lock-doc-face */
    color: #bc8f8f;
  }
  .org-escape-glyph {
    /* escape-glyph */
    color: #a52a2a;
  }
  .org-file-name-shadow {
    /* file-name-shadow */
    color: #7f7f7f;
  }
  .org-fixed-pitch {
  }
  .org-fringe {
    /* fringe */
    background-color: #f2f2f2;
  }
  .org-function-name {
    /* font-lock-function-name-face */
    color: #0000ff;
  }
  .org-header-line {
    /* header-line */
    color: #333333;
    background-color: #e5e5e5;
  }
  .org-help-argument-name {
    /* help-argument-name */
    font-style: italic;
  }
  .org-highlight {
    /* highlight */
    background-color: #b4eeb4;
  }
  .org-holiday {
    /* holiday */
    background-color: #ffc0cb;
  }
  .org-info-header-node {
    /* info-header-node */
    color: #a52a2a;
    font-weight: bold;
    font-style: italic;
  }
  .org-info-header-xref {
    /* info-header-xref */
    color: #0000ff;
    text-decoration: underline;
  }
  .org-info-menu-header {
    /* info-menu-header */
    font-weight: bold;
  }
  .org-info-menu-star {
    /* info-menu-star */
    color: #ff0000;
  }
  .org-info-node {
    /* info-node */
    color: #a52a2a;
    font-weight: bold;
    font-style: italic;
  }
  .org-info-title-1 {
    /* info-title-1 */
    font-size: 172%;
    font-weight: bold;
  }
  .org-info-title-2 {
    /* info-title-2 */
    font-size: 144%;
    font-weight: bold;
  }
  .org-info-title-3 {
    /* info-title-3 */
    font-size: 120%;
    font-weight: bold;
  }
  .org-info-title-4 {
    /* info-title-4 */
    font-weight: bold;
  }
  .org-info-xref {
    /* info-xref */
    color: #0000ff;
    text-decoration: underline;
  }
  .org-isearch {
    /* isearch */
    color: #b0e2ff;
    background-color: #cd00cd;
  }
  .org-italic {
    /* italic */
    font-style: italic;
  }
  .org-keyword {
    /* font-lock-keyword-face */
    color: #a020f0;
  }
  .org-lazy-highlight {
    /* lazy-highlight */
    background-color: #afeeee;
  }
  .org-link {
    /* link */
    color: #0000ff;
    text-decoration: underline;
  }
  .org-link-visited {
    /* link-visited */
    color: #8b008b;
    text-decoration: underline;
  }
  .org-match {
    /* match */
    background-color: #ffff00;
  }
  .org-menu {
  }
  .org-message-cited-text {
    /* message-cited-text */
    color: #ff0000;
  }
  .org-message-header-cc {
    /* message-header-cc */
    color: #191970;
  }
  .org-message-header-name {
    /* message-header-name */
    color: #6495ed;
  }
  .org-message-header-newsgroups {
    /* message-header-newsgroups */
    color: #00008b;
    font-weight: bold;
    font-style: italic;
  }
  .org-message-header-other {
    /* message-header-other */
    color: #4682b4;
  }
  .org-message-header-subject {
    /* message-header-subject */
    color: #000080;
    font-weight: bold;
  }
  .org-message-header-to {
    /* message-header-to */
    color: #191970;
    font-weight: bold;
  }
  .org-message-header-xheader {
    /* message-header-xheader */
    color: #0000ff;
  }
  .org-message-mml {
    /* message-mml */
    color: #228b22;
  }
  .org-message-separator {
    /* message-separator */
    color: #a52a2a;
  }
  .org-minibuffer-prompt {
    /* minibuffer-prompt */
    color: #0000cd;
  }
  .org-mm-uu-extract {
    /* mm-uu-extract */
    color: #006400;
    background-color: #ffffe0;
  }
  .org-mode-line {
    /* mode-line */
    color: #000000;
    background-color: #bfbfbf;
  }
  .org-mode-line-buffer-id {
    /* mode-line-buffer-id */
    font-weight: bold;
  }
  .org-mode-line-highlight {
  }
  .org-mode-line-inactive {
    /* mode-line-inactive */
    color: #333333;
    background-color: #e5e5e5;
  }
  .org-mouse {
    /* mouse */
    background-color: #000000;
  }
  .org-negation-char {
  }
  .org-next-error {
    /* next-error */
    background-color: #eedc82;
  }
  .org-nobreak-space {
    /* nobreak-space */
    color: #a52a2a;
    text-decoration: underline;
  }
  .org-org-agenda-date {
    /* org-agenda-date */
    color: #0000ff;
  }
  .org-org-agenda-date-weekend {
    /* org-agenda-date-weekend */
    color: #0000ff;
    font-weight: bold;
  }
  .org-org-agenda-restriction-lock {
    /* org-agenda-restriction-lock */
    background-color: #ffff00;
  }
  .org-org-agenda-structure {
    /* org-agenda-structure */
    color: #0000ff;
  }
  .org-org-archived {
    /* org-archived */
    color: #7f7f7f;
  }
  .org-org-code {
    /* org-code */
    color: #7f7f7f;
  }
  .org-org-column {
    /* org-column */
    background-color: #e5e5e5;
  }
  .org-org-column-title {
    /* org-column-title */
    background-color: #e5e5e5;
    font-weight: bold;
    text-decoration: underline;
  }
  .org-org-date {
    /* org-date */
    color: #a020f0;
    text-decoration: underline;
  }
  .org-org-done {
    /* org-done */
    color: #228b22;
    font-weight: bold;
  }
  .org-org-drawer {
    /* org-drawer */
    color: #0000ff;
  }
  .org-org-ellipsis {
    /* org-ellipsis */
    color: #b8860b;
    text-decoration: underline;
  }
  .org-org-formula {
    /* org-formula */
    color: #b22222;
  }
  .org-org-headline-done {
    /* org-headline-done */
    color: #bc8f8f;
  }
  .org-org-hide {
    /* org-hide */
    color: #e5e5e5;
  }
  .org-org-latex-and-export-specials {
    /* org-latex-and-export-specials */
    color: #8b4513;
  }
  .org-org-level-1 {
    /* org-level-1 */
    color: #0000ff;
  }
  .org-org-level-2 {
    /* org-level-2 */
    color: #b8860b;
  }
  .org-org-level-3 {
    /* org-level-3 */
    color: #a020f0;
  }
  .org-org-level-4 {
    /* org-level-4 */
    color: #b22222;
  }
  .org-org-level-5 {
    /* org-level-5 */
    color: #228b22;
  }
  .org-org-level-6 {
    /* org-level-6 */
    color: #5f9ea0;
  }
  .org-org-level-7 {
    /* org-level-7 */
    color: #da70d6;
  }
  .org-org-level-8 {
    /* org-level-8 */
    color: #bc8f8f;
  }
  .org-org-link {
    /* org-link */
    color: #a020f0;
    text-decoration: underline;
  }
  .org-org-property-value {
  }
  .org-org-scheduled-previously {
    /* org-scheduled-previously */
    color: #b22222;
  }
  .org-org-scheduled-today {
    /* org-scheduled-today */
    color: #006400;
  }
  .org-org-sexp-date {
    /* org-sexp-date */
    color: #a020f0;
  }
  .org-org-special-keyword {
    /* org-special-keyword */
    color: #bc8f8f;
  }
  .org-org-table {
    /* org-table */
    color: #0000ff;
  }
  .org-org-tag {
    /* org-tag */
    font-weight: bold;
  }
  .org-org-target {
    /* org-target */
    text-decoration: underline;
  }
  .org-org-time-grid {
    /* org-time-grid */
    color: #b8860b;
  }
  .org-org-todo {
    /* org-todo */
    color: #ff0000;
  }
  .org-org-upcoming-deadline {
    /* org-upcoming-deadline */
    color: #b22222;
  }
  .org-org-verbatim {
    /* org-verbatim */
    color: #7f7f7f;
    text-decoration: underline;
  }
  .org-org-warning {
    /* org-warning */
    color: #ff0000;
    font-weight: bold;
  }
  .org-outline-1 {
    /* outline-1 */
    color: #0000ff;
  }
  .org-outline-2 {
    /* outline-2 */
    color: #b8860b;
  }
  .org-outline-3 {
    /* outline-3 */
    color: #a020f0;
  }
  .org-outline-4 {
    /* outline-4 */
    color: #b22222;
  }
  .org-outline-5 {
    /* outline-5 */
    color: #228b22;
  }
  .org-outline-6 {
    /* outline-6 */
    color: #5f9ea0;
  }
  .org-outline-7 {
    /* outline-7 */
    color: #da70d6;
  }
  .org-outline-8 {
    /* outline-8 */
    color: #bc8f8f;
  }
  .outline-text-1, .outline-text-2, .outline-text-3, .outline-text-4, .outline-text-5, .outline-text-6 {
    /* Add more spacing between section. Padding, so that folding with org-info.js works as expected. */

  }

  .org-preprocessor {
    /* font-lock-preprocessor-face */
    color: #da70d6;
  }
  .org-query-replace {
    /* query-replace */
    color: #b0e2ff;
    background-color: #cd00cd;
  }
  .org-regexp-grouping-backslash {
    /* font-lock-regexp-grouping-backslash */
    font-weight: bold;
  }
  .org-regexp-grouping-construct {
    /* font-lock-regexp-grouping-construct */
    font-weight: bold;
  }
  .org-region {
    /* region */
    background-color: #eedc82;
  }
  .org-rmail-highlight {
  }
  .org-scroll-bar {
    /* scroll-bar */
    background-color: #bfbfbf;
  }
  .org-secondary-selection {
    /* secondary-selection */
    background-color: #ffff00;
  }
  .org-shadow {
    /* shadow */
    color: #7f7f7f;
  }
  .org-show-paren-match {
    /* show-paren-match */
    background-color: #40e0d0;
  }
  .org-show-paren-mismatch {
    /* show-paren-mismatch */
    color: #ffffff;
    background-color: #a020f0;
  }
  .org-string {
    /* font-lock-string-face */
    color: #bc8f8f;
  }
  .org-texinfo-heading {
    /* texinfo-heading */
    color: #0000ff;
  }
  .org-tool-bar {
    /* tool-bar */
    color: #000000;
    background-color: #bfbfbf;
  }
  .org-tooltip {
    /* tooltip */
    color: #000000;
    background-color: #ffffe0;
  }
  .org-trailing-whitespace {
    /* trailing-whitespace */
    background-color: #ff0000;
  }
  .org-type {
    /* font-lock-type-face */
    color: #228b22;
  }
  .org-underline {
    /* underline */
    text-decoration: underline;
  }
  .org-variable-name {
    /* font-lock-variable-name-face */
    color: #b8860b;
  }
  .org-variable-pitch {
  }
  .org-vertical-border {
  }
  .org-warning {
    /* font-lock-warning-face */
    color: #ff0000;
    font-weight: bold;
  }
  .rss_box {}
  .rss_title, rss_title a {}
  .rss_items {}
  .rss_item a:link, .rss_item a:visited, .rss_item a:active {}
  .rss_item a:hover {}
  .rss_date {}

  #postamble {
    padding: .3em;
    margin-bottom: 1em;
    border: 1px solid gray;
    background-color: #eeeeee;
  }

  #show_source {float: right; margin: .7em;}
  

} /* END OF @media all */



@media screen
{
  #table-of-contents {
    float: right;
    border: 1px solid #CCC;
    max-width: 50%;
    overflow: auto;
  }
} /* END OF @media screen */

/* Date Author 显示字体及背景 */
div#postamble {
	margin: 20px 0px 20px 0px;
	font-style: italic;
	font-size: 11px;
	font-family:"Courier New", Courier, monospace;
    background: white;
}