html, body {
  margin: 0;
  padding: 0;
  line-height: 1.5;
  font-size: 106%;
  /*font-family: "Microsoft YaHei", sans-serif;*/
  /*font-family: "Helvetica neue",Helvetica,Tahoma,"lantinghei sc","Microsoft Yahei", sans-serif;*/
  font-family: "Helvetica neue", "Microsoft Yahei", sans-serif;
  word-break: break-word;
  /* word-break: break-all; */
  background-color: #fff;
}

hr {
  border: none;
  border-bottom: dashed 2px #D3DCE6; /* element-ui gray */
}

img {
  border: 0;
  max-width: 100%;
  /* height: auto; */
}
ul, ol {
  padding-left: 30px;
}

code, kbd, pre, samp { /* normalize.css */
  font-family: monospace, monospace;
  font-size: 1em;
}

/* 隐藏局部滚动条 样式兼容问题 */
pre code::-webkit-scrollbar, table::-webkit-scrollbar{display:none;}

pre {
  word-break: break-all;
}
code {
  /* .hljs zenburn */
  background: #3f3f3f;
  color: #dcdcdc;
  font-size: 80%;
  -webkit-border-radius: 6px; /* 同scroller圆角 */
  border-radius: 6px;
}
pre code, pre code.hljs {
  display: block;
  overflow-x: auto;
  padding: 0.6em 1em;
}

/* learnt from github */
table {
  font-size: 80%;
  width: 100%;
  overflow: auto;
  word-break: normal;
  display: block;
  margin: 15px 0;
  border-collapse: collapse;
  border-spacing: 0;
}
table th, table td {
  border: 1px solid #ddd;
  padding: 6px 13px;
  min-width: 4em;
}
table tr {
  border-top: 1px solid #ccc;
  background-color: #fff;
}
table tr:nth-child(2n) {
  background-color: #f8f8f8;
}
blockquote {
  margin: 15px 0;
  border-left: 4px solid #DDD;
  padding: 0 15px;
  color: #777;
}
a {
  color: #4078c0;
}

.sidebar {
  color: #fff;
}
.sidebar-inner {
  padding: 2% 5%;
}
.sidebar ul, .sidebar ol {
  padding-left: 0;
}
.sidebar li {
  display: inline-block;
  margin-right: .3em;
}
.sidebar a {
  color: #fff;
}
.sidebar h1 a {
  text-decoration: none;
}
.sidebar blockquote {
  color: #bbb;
}

.main-inner {
  padding: 2% 5% 6%;
}
#comment-system {
  padding-top: 3%;
}
#comment-system:empty {
  padding-top: 0;
}
.main-page img {
  /*-webkit-box-shadow: 0 0 6px rgba(0,0,0, .6);
  -moz-box-shadow: 0 0 6px rgba(0,0,0, .6);
  -ms-box-shadow: 0 0 6px rgba(0,0,0, .6);
  -o-box-shadow: 0 0 6px rgba(0,0,0, .6);
  box-shadow: 0 0 6px rgba(0,0,0, .6);*/
  /* fix transparent image background in darkmode */
  background-color: rgba(255, 255, 255, .2);
}

.img-holder {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.fork-me {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 9999;
}

/* 实现trello的 超链接效果 自动识别github issues */
.known-service-link {
  font-size: 90%;
  color: #444;
  background: #D6DADC;
  border-radius: 3px;
  /* avoid linebreak between icon and text */
  word-break: break-all;
}
.known-service-icon {
  width: 14px;
  height: 14px;
  margin: -2px 3px 0 0;
  vertical-align: middle;
}

/* 暂时感觉这类标签应该inline-block展示 */
code,
.known-service-link {
  display: inline-block;
  margin: 2px;
  padding: 0 4px;
}

@media (min-width: 640px) {
  ul, ol {
    padding-left: 40px;
  }
  table {
    font-size: 100%;
  }

  .sidebar-inner {
    padding: 2% 10%;
  }

  .main-inner {
    padding-left: 10%;
    padding-right: 10%;
  }

  .fork-me {
    position: fixed;
  }
}

@media (min-width: 990px) {
  .sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: 25%;
  }
  .sidebar ul, .sidebar ol {
    padding-left: 30px;
  }
  .sidebar li {
    display: list-item;
    margin-right: 0;
  }
  .sidebar-inner {
    padding: 15%;
  }

  .main {
    margin-left: 25%;
    width: 75%;
  }
}

/* avoid losing height while swithcing contents */
.contents-preparing {
  visibility: hidden;
}

/* pace minimal */
/* https://codebyzach.github.io/pace/ */
.pace {
	-webkit-pointer-events: none;
	pointer-events: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}
.pace-inactive {
	display: none;
}
.pace .pace-progress {
	background: #29d;
	position: fixed;
	z-index: 2000;
	top: 0;
	right: 100%;
	width: 100%;
	height: 2px;
}

/* mermaid lazyload */
.mermaid {
  visibility: hidden;
}
.mermaid[data-processed="true"] {
  visibility: visible;
}

details {
  padding-left: 30px; /* 正文不分尽量与ul/ol/li对齐 */
}
details > summary {
  cursor: pointer;
}