/* updated by K from https://t.me/hihackers
 * on 2017/10/19
 * @Yokohama, Japan
 * */

/* CSS RESET
========================================================================*/
figure {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
figure { /* HTML5 display-role reset for older browsers */
  display: block;
}

@font-face {
  font-family: 'Noto Sans SC';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/NotoSansSC-Regular.eot');
  src: url('../fonts/NotoSansSC-Regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/NotoSansSC-Regular.woff') format('woff'),
       url('../fonts/NotoSansSC-Regular.ttf') format('truetype'),
       url('../fonts/NotoSansSC-Regular.svg#NotoSansSC-Regular') format('svg');
}

@font-face {
  font-family: 'Chinese Quotation Marks';
  unicode-range: U+201C-201D, U+2018-2019;
  src: url('../fonts/NotoSansSC-Regular.eot');
  src: url('../fonts/NotoSansSC-Regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/NotoSansSC-Regular.woff') format('woff'),
       url('../fonts/NotoSansSC-Regular.ttf') format('truetype'),
       url('../fonts/NotoSansSC-Regular.svg#NotoSansSC-Regular') format('svg');
}

@font-face {
  font-family: 'OpenSans Regular';
  src: url('../fonts/OpenSans-Regular.eot');
  src: url('../fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/OpenSans-Regular.woff') format('woff'),
       url('../fonts/OpenSans-Regular.ttf') format('truetype'),
       url('../fonts/OpenSans-Regular.svg#OpenSans-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Source Code Pro Regular';
  src: url('../fonts/SourceCodePro-Regular.eot');
  src: url('../fonts/SourceCodePro-Regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/SourceCodePro-Regular.woff') format('woff'),
       url('../fonts/SourceCodePro-Regular.ttf') format('truetype'),
       url('../fonts/SourceCodePro-Regular.svg#Source Code Pro Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}

body {
  background-color: #FFFFFF;
  font-family: 'Chinese Quotation Marks', 'OpenSans Regular', 'Helvetica Neue', Helvetica, 'Noto Sans SC', 'Microsoft YaHei', "微软雅黑", STXihei, "华文细黑", Arial, sans-serif;
  font-size: 16px; 
  line-height: 28px;
  letter-spacing: 1px; 
  -webkit-font-smoothing: antialiased;        /* 字体抗锯齿 */
  -webkit-text-stroke-width: 0.2px;           /* 设置或检索对象中的文字的描边宽度。可取小数和 medium（描边宽度中等），thick（描边宽度粗），thin（描边宽度细）关键字。默认值为 0 */
  -moz-osx-font-smoothing: grayscale;         /* 字体抗锯齿 */
}

code,
kbd,
samp {
  font-family: 'Source Code Pro Regular', 'Noto Sans SC', monospace, monospace, 'Microsoft YaHei', "微软雅黑", STXihei, "华文细黑", Arial, sans-serif;
  font-size: 1em;
}

h1 {
  font-size: 1.8em;
}

h2 {
  font-size: 1.6em;
}

h3 {
  font-size: 1.4em;
}

h4 {
  font-size: 1.2em;
}

.new {
  width: 188px;
  padding: 3px 6px;
  background-color: #333333;  
  color: white;
}

audio {
  width: 100%;
}

/* TOC STYLE
========================================================================*/

#markdown-toc::before {
    content: "CONTENTS";
    font-weight: bold;
}

#markdown-toc ul {
    list-style: decimal;
}

#markdown-toc {
    border: 1px solid #aaa;
    list-style: decimal;
    display: inline-block;
}

/* GLOBAL LI STYLE
========================================================================*/
li { list-style: none; }

#content li { list-style: square; }

#content ol li { list-style-type: decimal; }

/* GLOBAL A STYLE
========================================================================*/
a:link { text-decoration: none; color: black; } 
a:hover { text-decoration: underline; color: black; } 
a:active { text-decoration: none; color: black; } 
a:visited { text-decoration: none; color: black; } 
/* GLOBAL A STYLE: END */

/* POST MAIN BODY EXTERNAL LINK STYLE
========================================================================*/
#post_main_body a:not(.no-icon):not(.anchor):not(.footnote):not(.reversefootnote), .external-link {
  padding-right: 12px;
  background: url('data:image/png;base64,R0lGODlhDAAMAIABAAAAAP///yH5BAEKAAEALAAAAAAMAAwAAAIajI+JwKDXTHNhysXqlXlB6iWgJoZmNUXPUwAAOw==') no-repeat right 3px;
}
#post_main_body #markdown-toc a {
  background: none;
}
#post_main_body a:hover:not(.no-icon):not(.anchor):not(.footnote):not(.reversefootnote), .external-link:hover {
  padding-right: 12px;
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4AwYCQQJmKxlfAAAAE9JREFUKM9jYCARMOKTdIz78R+Zv38RByMTPg37F3FgGMiCyyRs4nAN2ExDVrx/EQcjjM9EyO0wg2A0yX5gwOVWXHJMpMYDyRpYiHEWRQAAH/Qiri36zqEAAAAASUVORK5CYII=') no-repeat right 3px;
}
#post_main_body #markdown-toc a:hover {
  background: none;
}

.logo_pic img, img { /* logo image style */
  border:none;
}

.menu {
  font-family: 'Source Code Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

ul.menu li.icon { /* Hide the list item that contains the link that should open and close the topnav on small screens */
  display: none;
}

video { /* video size */
  max-width: 100% !important;
  height: auto;
}

.xiaomiquan { /* xiaomiquan style */
  border: 1px solid #dddddd;
  margin: 10px 0;
  background: #e7e9ee;
  width: auto;
  border-radius: 1px;
  -moz-border-radius: 1px; /* old Firefox */
}

.pageNavi {
display: inline-block;
}
.prevPost {float: left;}
.nextPost {float: right;}
.prevPost, .nextPost {
  border: #DDDDDD 1px solid;
  padding: 3px;
  margin: 5px 0 5px 0;
}

/* QUOTES
========================================================================*/
blockquote>:first-child {
  margin-top: 0px;
}

blockquote>:last-child {
  margin-bottom: 0px;
}

/* HORIZONTAL RULES
========================================================================*/
hr {
  clear: both;
  margin: 15px 0;
  height: 0px;
  overflow: hidden;
  border: none;
  background: transparent;
  border-bottom: 1px solid #ddd;
  padding: 0;
}
#hr_dotted {
  clear: both;
  margin: 15px 0;
  height: 0px;
  width: 100%;
  overflow: hidden;
  border: none;
  background: transparent;
  border-bottom: 1px dotted #ddd;
  padding: 0;
}

/* BLACK_OUT
========================================================================*/
#black_out {
  background-color: black;
}

/* HIGHLIGHTER
========================================================================*/
#highlighter {
  background-color: #B4E7F8;
}
#highlighter_underline {
  border-bottom: 4px solid #B4E7F8;
}

kbd {
  margin: 0px 0.1em;
  padding: 0.15em 0.6em;
  border-radius: 3px;
  border: 1px solid rgb(204, 204, 204);
  color: rgb(51, 51, 51);
  line-height: 1.2;
  /*  font-family: Arial,Helvetica,sans-serif; */
  font-size: 14px;
  display: inline-block;
  box-shadow: 0px 1px 0px rgba(0,0,0,0.2), inset 0px 0px 0px 2px #ffffff;
  background-color: rgb(247, 247, 247);
  -moz-box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 2px #ffffff inset;
  -webkit-box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 2px #ffffff inset;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  text-shadow: 0 1px 0 #fff;
}

.links a {
  display: inline-block; /* this inline-block should be kept here to make word-wrap effective */
  word-wrap: normal;
  margin-right: 1em;
}

.rewardButton {
  border: 0;
  outline: 0;
  border-radius: 100%;
  padding: 0;
  margin: 0;
  letter-spacing: normal;
  text-transform: none;
  text-indent: 0;
  text-shadow: none;
}
.rewardButton a {
  display: inline-block;
  width: 15em;
  height: 2em;
  border-radius: 5px;
  color: #fff;
  background: #f44336;
}

.searchForm input {
  font-family: 'Noto Sans SC';
  font-size: 16px;
  line-height: 28px;
  letter-spacing: 1px;
}

.search-button {
  width: 20%;
  display: block;
  margin-top: 0.4em;
  margin-left: 40%;
}

.search-content {
  width: 70%;
  margin-left: 15%;
  border-style: none none solid none;
  border-width: 1px;
  outline: medium;
}

.canvas text {
  font-family: 'Chinese Quotation Marks', 'OpenSans Regular', 'Helvetica Neue', Helvetica, 'Noto Sans SC', 'Microsoft YaHei', "微软雅黑", STXihei, "华文细黑", Arial, sans-serif!important;
}

#decryption-password {
  width: 86px;
}

#decryption-button {
  font-family: 'Noto Sans SC';
  margin-top: 5px;
  width: 90px;
}

#decrypted-content > * {
  font-family: 'Chinese Quotation Marks', 'OpenSans Regular', 'Helvetica Neue', Helvetica, 'Noto Sans SC', 'Microsoft YaHei', "微软雅黑", STXihei, "华文细黑", Arial, sans-serif;
}

.cryptedmail:after {
  content: attr(data-name) "@" attr(data-domain) "." attr(data-tld); 
}

#post-url, #post-category, #post-tags {
display: none;
}

sup {
  top: -0.5em;
  margin: 0 1px 0 1px;
}

.footnote-ref {
  background-color: lightgray;
  border-radius: 3px;
  padding: 0 3px 0 3px;
}

.footnotes {
  margin-top: 1.7em;
  position: relative;
  font-size: 15px;
  line-height: 27px;
  -webkit-text-stroke-width: 0.1px;
}

.footnotes-title {
  position: absolute;
  top: -1em;
  line-height: 1.7em;
  padding: 0 1em;
  font-size: 10px;
  background-color: #fff;
}

.footnotes p, ol p {
  margin: 0;
  padding-left: 3px!important;
}

#gpg-list {
  display: flex;
  flex-wrap: wrap;
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
}

#gpg-list > span {
  width: 20%;
  text-align: center;
}

.wo-black {
  color: white;
  font-size: 14px;
  border-radius: 2px;
  padding: 1px 5px 1px 5px;
  background-color: #000;
}

.wob {
  color: white;
  font-size: 14px;
  border-radius: 2px;
  padding: 1px 5px 1px 5px;
  background-color: #4A8AF4;
}

.wog {
  color: white;
  font-size: 14px;
  border-radius: 2px;
  padding: 1px 5px 1px 5px;
  background-color: #AAA;
}

mark { /* refer to https://stackoverflow.com/questions/43683187/how-can-i-create-custom-underline-or-highlight-for-text-in-html-or-css */
  background: url("data:image/svg+xml;charset=utf8,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' width='1px' height='1px' viewBox='0 0 1 1' preserveAspectRatio='none'%3E%3Crect x='0' y='0' width='1' height='1' fill='yellow' /%3E%3C/svg%3E") no-repeat 100% 100%;
  background-size: 100% 50%;
}

textarea {
  font-family: monospace;
}