 /* 根元素
  <html>
 */

 /* 章节
  <body> <section> <nav> <article> <aside> <h1*6> <header> <footer> <address> <main>
 */

 /* 组织内容
  <p> <hr> <pre> <blockquote> <ol> <ul> <li> <dl> <dt> <dd> <figure> <figcaption> <div>
 */
 hr {
   color: #e1e4e8;
 }

 pre {
   color: #bcbcbc;
 }

 blockquote {
   border-left: 3px solid #c8c8c8;
   color: #5d5d5d;
 }

 /* 文字形式
  <a> <em> <strong> <small> <s> <cite> <q> <dfn> <abbr> <time> <code> <var> <samp> <kbd>
  <sub> <sup> <i> <b> <u> <mark> <ruby> <rt> <rp> <bdi> <bdo> <span> <br> <wbr> 
 */
 a {
   color: #d59500;
 }

 a:hover {
   border-bottom: 1px solid #d59500;
 }

 a.list,
 .post-nav a,
 .copyright a,
 .masthead .menu a,
 #TableOfContents li,
 .menu button {
   color: #000;
 }

 a.list:hover,
 .post-nav a:hover,
 .copyright a:hover,
 .masthead .menu a:hover,
 .masthead .menu .active a:hover {
   color: #d59500;
   border-bottom: 1px solid #d59500;
 }

 .menu button:hover {
   color: #d59500;
 }

 #TableOfContents>ul li:hover {
   color: #d59500;
 }

 .masthead .menu .active a {
   border-bottom: 1px solid #000;
 }

 code {
   background: #e8e8e8;
   color: #000;
 }

 /* 编辑
  <ins> <del>
 */
 ins {
   color: #777;
 }

 del {
   color: gray;
 }

 /* 嵌入内容
  <img> <iframe> <embed> <object> <param> <video> <audio> <source> <track> <canvas> <map>
  <area> <area> <map> <svg> <math>
 */
 img[src$="#border"] {
   border: 1px solid #e1e4e8;
   box-shadow: 5px 5px 5px #f6f8fa;
 }

 /* 表格
  <table> <caption> <colgroup> <col> <tbody> <thead> <tfoot> <tr> <td> <th>
 */
 thead {
   background-color: #f6f8fa;
 }

 table tr:nth-child(2n) {
   background-color: #f6f8fa;
 }

 td,
 th {
   border: 1px solid #e1e4e8;
 }

 /* 表单
  <form> <fieldset> <legend> <label> <input> <button> <select> <datalist> <optgroup> <option>
  <select> <textarea> <keygen> <output> <progress> <meter>
 */

 /* 交互元素
  <details> <summary> <menuitem> <menu>
 */

 /* 选择器 class id  */
 .main {
   border-left: 1px solid #e1e4e8;
 }

 .masthead {
   background: #fff;
 }

 .menu button {
   background: linear-gradient(#fff, #fff);
 }

 .subtitle {
   color: #666;
 }

 #Msg {
   background: #ffffe0;
 }

 #eof {
   color: #c3c3c3;
 }

 .home .wrapper {
   background: #efefef;
 }

 /* 伪类 */
 ::selection {
   background: #fefecc;
 }

 :focus {
   outline: none;
   box-shadow: 0 0 0em 0.1em #d59500;
   border-radius: 1px;
 }

 /* 首页 */
 main.index {
   background-color: #fff;
 }

 article.index button {
   background: linear-gradient(#fff, #fff);
 }

 main.index:hover aside {
   background: #efefef;
 }

 article.index {
   border-top: 2px solid #e1e4e8;
   border-bottom: 2px solid #e1e4e8;
 }

 article.index a,
 article.index button,
 article.index ruby.link,
 article.index ruby.link:hover a,
 article.index ruby.link:hover rt {
   color: #d59500;
 }

 article.index ruby.link a:hover {
   border-bottom: 1px solid #d59500;
 }

 @media only screen and (max-width:668px) {
   aside.index {
     background: #f6f8fa;
   }
 }

 /* 移动端与 PC 端适配 */
 @media screen and (max-width:1220px) {

   .masthead .menu .active a,
   .masthead .menu .active a:hover {
     border: 1px solid #000 !important;
   }

   .masthead {
     border-bottom: 1px solid #e1e4e8;
     background: #f6f8fa;
   }

   .menu button {
     background: linear-gradient(#f6f8fa, #f6f8fa);
   }

   .main {
     border: none;
   }

 }