@charset "UTF-8";
html, body {
  position: relative;
  margin: 0;
  padding: 0; }

a {
  color: inherit;
  text-decoration: none; }

html {
  font-size: 10px; }

body {
  font-family: Content-font, Roboto, sans-serif;
  font-size: 16px; }

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
  background-color: transparent; }

/*婊氬姩鏉＄殑杞ㄩ亾*/
::-webkit-scrollbar-track {
  background-color: transparent; }

/*婊氬姩鏉＄殑婊戝潡鎸夐挳*/
::-webkit-scrollbar-thumb {
  width: 6px;
  height: 6px;
  border-radius: 6px;
  background-color: #CCCCCC; }

.container {
  position: relative;
  width: 100%;
  align-items: center;
  max-width: 900px;
  margin: 0 auto;
  box-sizing: border-box; }

.clear-float {
  display: block;
  clear: both; }

@keyframes slideDown {
  0% {
    opacity: 0;
    transform: translateY(-70%); }
  30% {
    opacity: 1;
    transform: translateY(0); }
  60% {
    opacity: 0;
    transform: translateY(70%); }
  to {
    opacity: 0; } }
/* cyrillic-ext */
@font-face {
  font-family: 'Source Code Pro';
  font-style: normal;
  font-weight: 500;
  src: local("Source Code Pro Medium"), local("SourceCodePro-Medium"), url(https://fonts.gstatic.com/s/sourcecodepro/v11/HI_XiYsKILxRpg3hIP6sJ7fM7PqtzsjDvucq_mk.woff2) format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
/* cyrillic */
@font-face {
  font-family: 'Source Code Pro';
  font-style: normal;
  font-weight: 500;
  src: local("Source Code Pro Medium"), local("SourceCodePro-Medium"), url(https://fonts.gstatic.com/s/sourcecodepro/v11/HI_XiYsKILxRpg3hIP6sJ7fM7PqtzsjDt-cq_mk.woff2) format("woff2");
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
/* greek */
@font-face {
  font-family: 'Source Code Pro';
  font-style: normal;
  font-weight: 500;
  src: local("Source Code Pro Medium"), local("SourceCodePro-Medium"), url(https://fonts.gstatic.com/s/sourcecodepro/v11/HI_XiYsKILxRpg3hIP6sJ7fM7PqtzsjDsOcq_mk.woff2) format("woff2");
  unicode-range: U+0370-03FF; }
/* vietnamese */
@font-face {
  font-family: 'Source Code Pro';
  font-style: normal;
  font-weight: 500;
  src: local("Source Code Pro Medium"), local("SourceCodePro-Medium"), url(https://fonts.gstatic.com/s/sourcecodepro/v11/HI_XiYsKILxRpg3hIP6sJ7fM7PqtzsjDvOcq_mk.woff2) format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB; }
/* latin-ext */
@font-face {
  font-family: 'Source Code Pro';
  font-style: normal;
  font-weight: 500;
  src: local("Source Code Pro Medium"), local("SourceCodePro-Medium"), url(https://fonts.gstatic.com/s/sourcecodepro/v11/HI_XiYsKILxRpg3hIP6sJ7fM7PqtzsjDvecq_mk.woff2) format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
/* latin */
@font-face {
  font-family: 'Source Code Pro';
  font-style: normal;
  font-weight: 500;
  src: local("Source Code Pro Medium"), local("SourceCodePro-Medium"), url(https://fonts.gstatic.com/s/sourcecodepro/v11/HI_XiYsKILxRpg3hIP6sJ7fM7PqtzsjDs-cq.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/*

Dark style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org>

*/
.hljs {
  display: block;
  overflow-x: auto;
  padding: 0.5em;
  background: #444; }

.hljs-keyword,
.hljs-selector-tag,
.hljs-literal,
.hljs-section,
.hljs-link {
  color: #61E3A5; }

.hljs,
.hljs-subst {
  color: #ddd; }

.hljs-string,
.hljs-title,
.hljs-name,
.hljs-type,
.hljs-attribute,
.hljs-symbol,
.hljs-bullet,
.hljs-built_in,
.hljs-addition,
.hljs-variable,
.hljs-template-tag,
.hljs-template-variable {
  color: #d88; }

.hljs-comment,
.hljs-quote,
.hljs-deletion,
.hljs-meta {
  color: #9DAAB6; }

.hljs-emphasis {
  font-style: italic; }

@media screen and (max-width: 1000px) {
  .banner .slogan {
    font-size: 1.6rem; }
    .banner .slogan .emphasis {
      display: block;
      margin-right: 0; }
  .banner .icon {
    margin-top: 2rem; }
  .banner .icon > span {
    font-size: 2rem;
    margin-left: 1rem; }
  .banner .description {
    font-size: 1.2rem;
    margin-top: 1rem; }

  .main section {
    padding: 2rem 0; }
    .main section > .title {
      font-size: 1.6rem; }
    .main section > .content {
      font-size: 1.4rem; }

  .download .other-releases {
    position: relative;
    display: block;
    margin-left: 0;
    left: 0;
    margin-top: 2em; }

  .code-samples {
    display: none; }

  .doc .content .navigation {
    margin-right: 0; }
  .doc .content .navigation > a {
    float: none;
    display: block;
    margin-top: 1rem;
    width: auto;
    padding: 0 1rem; }
    .doc .content .navigation > a:first-child {
      margin-top: 0; }
  .doc .content .navigation > a .wrapper {
    padding: 1em; }
    .doc .content .navigation > a .wrapper:after {
      font-size: 2rem;
      right: 0;
      top: 0; }
    .doc .content .navigation > a .wrapper .title {
      font-size: 1.2rem;
      margin-bottom: 0; }
    .doc .content .navigation > a .wrapper .desc {
      display: none;
      font-size: 1.2rem; }
  .doc .content .navigation > a.download .wrapper .title {
    margin-bottom: 0.8rem; }

  .copyright {
    font-size: 1.2rem;
    text-align: center; } }
header {
  z-index: 1;
  height: 8rem;
  display: flex;
  position: relative;
  box-shadow: 0 3px 8px 0 rgba(116, 129, 141, 0.1);
  background-color: #FFFFFF;
  border-bottom: 1px solid #d4dadf; }
  header .container {
    display: flex; }
  header .logo {
    float: left;
    display: flex;
    align-items: center;
    background-color: white; }
    header .logo img {
      width: 4rem;
      height: 4rem; }
    header .logo span {
      flex: 1;
      font-size: 2.4rem;
      font-weight: 500;
      overflow-wrap: break-word;
      margin-left: 0.8rem; }
  header .github {
    position: absolute;
    right: 0; }
  header .github:before {
    font-family: iconfont;
    content: "\e970";
    font-size: 4rem; }

@media screen and (max-width: 1000px) {
  header .logo {
    float: none;
    margin: 0 auto; }
  header .github {
    display: none; } }
hr {
  border-bottom: none;
  border-top: solid 1px #DEDEDE;
  margin: 2rem 0; }

.banner {
  text-align: center;
  padding: 4rem 2rem;
  background-color: #F5F7F9; }
  .banner .slogan {
    font-size: 3.2rem;
    font-weight: lighter;
    letter-spacing: 4px; }
    .banner .slogan .emphasis {
      font-weight: normal;
      margin-right: 0.5em; }
  .banner .icon {
    margin-top: 6rem; }
    .banner .icon > span {
      font-family: iconfont;
      font-size: 3.2rem;
      margin-left: 2rem; }
      .banner .icon > span:first-child {
        margin-left: 0; }
    .banner .icon .html:before {
      content: "\e600"; }
    .banner .icon .css:before {
      content: "\e604"; }
    .banner .icon .js:before {
      content: "\e619"; }
  .banner .description {
    color: #666666;
    margin-top: 2rem;
    line-height: 2em; }

.main {
  text-align: center; }
  .main section {
    padding: 6rem 0 4rem;
    border-top: solid 1px #F5F7F9; }
    .main section:first-child {
      border-top: none; }
  .main section > .title {
    color: black;
    font-size: 2.4rem;
    font-family: "Microsoft YaHei UI";
    margin-bottom: 3rem; }
  .main section > .content {
    overflow: hidden; }

.code-samples .content:after {
  display: block;
  content: "";
  clear: both; }
.code-samples .content .description {
  clear: both;
  color: #999999;
  font-size: 1.4rem;
  margin-top: 2rem; }
.code-samples .code-sample {
  width: 45%;
  border-radius: 0.3rem;
  box-sizing: border-box; }
  .code-samples .code-sample:nth-child(1) {
    float: left; }
  .code-samples .code-sample:nth-child(2) {
    float: right; }
  .code-samples .code-sample ::-webkit-scrollbar-thumb {
    background-color: #0F1D55; }
  .code-samples .code-sample .code-sample-title {
    color: #666666;
    font-size: 1.4rem;
    margin-bottom: 1.2rem; }
  .code-samples .code-sample .code-block {
    white-space: pre;
    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Courier, monospace;
    font-size: 1.4rem;
    overflow: auto;
    color: #E6ECF1;
    padding: 2.4rem;
    text-align: left;
    border-radius: 0.3rem;
    background-color: #183055; }

.download .content-holder {
  position: relative;
  display: inline-block; }
.download .latest-version {
  position: relative;
  color: black;
  padding: 0.6rem 0;
  border-bottom: solid 1px black; }
  .download .latest-version:before {
    font-family: iconfont;
    content: "\e68d";
    margin-right: 1rem; }
  .download .latest-version:after {
    opacity: 0;
    position: absolute;
    font-family: iconfont;
    content: "\e601";
    right: 100%;
    top: 50%;
    margin-top: -0.5em;
    margin-right: 1rem;
    line-height: 1em; }
  .download .latest-version:hover:after {
    animation: slideDown linear 1.5s infinite; }
.download .other-releases {
  position: absolute;
  left: 100%;
  margin-left: 2em;
  color: #999999;
  white-space: nowrap;
  transition: color linear 0.1s; }
  .download .other-releases:hover {
    color: currentColor; }

.doc .navigation {
  margin-right: -2rem; }
  .doc .navigation:after {
    display: block;
    content: "";
    clear: both; }
.doc .navigation > a {
  float: left;
  display: block;
  position: relative;
  width: 25%;
  padding-right: 2rem;
  box-sizing: border-box; }
  .doc .navigation > a .wrapper {
    position: relative;
    padding: 2rem;
    color: #999999;
    font-size: 1.4rem;
    text-align: left;
    border-radius: 3px;
    border: solid 1px #E6ECF1;
    transition: border-color linear 0.1s; }
    .doc .navigation > a .wrapper:hover {
      border-color: #183055; }
  .doc .navigation > a .title {
    display: block;
    color: black;
    font-size: 2.4rem;
    font-family: "Microsoft YaHei UI";
    margin-bottom: 3rem;
    margin-bottom: 1.6rem; }

.copyright {
  padding: 1rem;
  font-size: 1.4rem;
  color: #999999;
  text-align: center; }
  .copyright a {
    text-decoration: underline;
    color: #5ac0ba; }

/*# sourceMappingURL=index.css.map */
