body {
  color:black;
  padding:50px;
  font-size:16px;
  line-height:1.5;
  font-weight:400;
  background-color:#fff;
  background-size:cover;
  background-repeat:no-repeat;
  background-attachment:fixed;
  background-position:center center;
  transition:background-color 0.5s, color 0.5s;
  background-image:url('../files/images/logo/no.webp');
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

/*
body {
  margin: 0;
  color: #000;
  padding: 50px;
  min-height: 100vh;
  position: relative;
  font: 400 16px/1.5 ???;
  transition: background-color .5s, color .5s;
}

body::before {
  top: 0;
  left: 0;
  content: "";
  z-index: -1;
  opacity: .75;
  width: 100vw;  
  height: 100vh; 
  position: fixed; 
  filter: blur(10px);
  background-attachment: fixed;
  background: url("../files/images/logo/xy3.png")
              center/cover no-repeat;
}
*/

h1, h2, h3, h4, h5, h6 {
  margin:0 0 20px;
}

p, ul, ol, table, pre, dl {
  margin:0 0 20px;
}

h1, h2, h3 {
  line-height:1.1;
}

h1 {
  font-size:28px;
  font-weight:500;
}

h2 {
  font-weight:500;
}

h3, h4, h5, h6 {
  font-weight:500;
}

a {
  color:#3399cc;
  text-decoration:none;
}

a:hover {
  padding:0;
  color:#156082;
  /*border-radius:5px;
  background-color:rgba(51, 153, 204, 0.2);*/
}

a small {
  display:block;
  font-size:11px;
  margin-top:-0.3em;
}

a:hover small {
  color:#777;
}

a[mytitle] {
  position:relative;
}

a[mytitle]:hover::after {
  top:-85%;
  left:50%;
  padding:0;
  color:#156082;
  font-size:14px;
  position:absolute;
  white-space:nowrap;
  border-radius:5px;
  content:attr(mytitle);
  transform:translate(-50%, 0);
  background-color:rgba(255, 255, 255, 0.8);
}

blockquote {
  margin:0;
  font-style:italic;
  padding:0 0 0 20px;
  border-left:1px solid #e5e5e5;
}

code, pre {
  color:#333;
  font-size:12px;
  font-family:Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal, Consolas, Liberation Mono, DejaVu Sans Mono, Courier New, monospace;
}

pre {
  overflow-x:auto;
  padding:8px 15px;
  border-radius:5px;
  background:#f8f8f8;
  border:1px solid #e5e5e5;
}

table {
  width:100%;
  border-collapse:collapse;
}

th, td {
  text-align:left;
  padding:5px 10px;
  border-bottom:1px solid #e5e5e5;
}

dt {
  color:#444;
  font-weight:500;
}

th {
  color:#444;
}

bi {
  font-weight:bold;
  font-style:italic;
}

gt {
  padding: 2px; 
  border-radius:7px;
  text-align: center;
  background: linear-gradient(to right,#b3d9ff,#f0f0f0);
}

jt {
  color:#666;
  font-weight:700;
  font-style:italic;
}

cjt {
  color:#666;
  font-weight:700;
  font-style:italic;
  letter-spacing:1.8px;
}

img {
  max-width:100%;
}

ul {
  margin:0;
  padding:0;
  list-style-type:none;
}

li {
  margin:0;
  align-items:-1.5px;
}

li::before {
  content:"";
  width:13px;
  height:13px;
  margin-right:8px;
  display:inline-block;
  background-size:cover;
  background-image:url('../files/images/logo/li.webp');
}

header {
  float:left;
  width:270px;
  height:90vh;
  position:fixed;
  overflow:hidden;
  overflow-y:scroll;
  scrollbar-width:none;
  -ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
  -webkit-font-smoothing:subpixel-antialiased;
}

header::-webkit-scrollbar {
  display:none;
}

header ul {
  padding:0;
  height:40px;
  width:270px;
  list-style:none;
  border-radius:5px;
  background:#f4f4f4;
  border:1px solid #e0e0e0;
}

header li {
  width:89px;
  float:left;
  height:40px;
  border-right:1px solid #e0e0e0;
}

header li:first-child a {
  border-radius:5px 0 0 5px;
}

header li:last-child a {
  border-radius:0 5px 5px 0;
}

header ul a {
  color:#999;
  height:34px;
  display:block;
  line-height:1;
  font-size:11px;
  padding-top:6px;
  text-align:center;
}

header ul a:hover {
  color:#999;
}

header ul a:active {
  background-color:#f0f0f0;
}

strong {
  color:#222;
  font-weight:500;
}

header ul li + li + li {
  width:89px;
  border-right:none;
}

header ul a strong {
  color:#222;
  font-size:14px;
  display:block;
}

section {
  width:500px;
  float:right;
  padding-bottom:50px;
}

small {
  font-size:11px;
}

hr {
  border:0;
  margin:0;
  width:95%;
  height:1.5px;
  margin-top:40px;
  background-color:black;
}

footer {
  float:left;
  width:270px;
  bottom:50px;
  position:fixed;
  -webkit-font-smoothing:subpixel-antialiased;
}

canvas {
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100%;
  position:fixed;
}

/*
@font-face {
  font-weight:300;
  font-display: swap;
  font-family: 'Montserrat';
  src: url('../files/fonts/Montserrat/Montserrat.ttf');
}
*/

@media print, screen and (max-width:960px) {
  div.wrapper {
    width:auto;
    margin:0;
  }

  header, section, footer {
    float:none;
    width:auto;
    position:static;
  }

  header {
    padding-right:320px;
  }

  section {
    padding:20px 0;
    margin:0 0 20px;
    border-style:solid;
    border-color:#e5e5e5;
    border-width:1px 0 0 0;
  }

  header a small {
    display:inline;
  }

  header ul {
    top:52px;
    right:50px;
    position:absolute;
  }
}

@media print, screen and (max-width:720px) {
  body {
    word-wrap:break-word;
  }
  header {
    padding:0;
  }
  header ul, header p.view {
    position:static;
  }
  pre, code {
    word-wrap:normal;
  }
}

@media print, screen and (max-width:480px) {
  body {
    padding:15px;
  }
  header ul {
    width:99%;
  }
  header li, header ul li + li + li {
    width:33%;
  }
}

@media print {
  body {
    color:#444;
    padding:0.4in;
    font-size:12pt;
  }
}

@media (prefers-color-scheme:dark) {
  body {
    color:#fff;
    background-image:none;
    background-color:#202020;
  }
  hr {
    background-color:#fff;
  }
  canvas {
    display:none;
  }
  li::before {
    background-image:url('../files/images/logo/li-dark.webp');
  }
  a[mytitle]:hover::after {
    background-color:#424242;
  }
  gt {
    color:white;
    background:none;
  }
  jt {
    color:white;
    font-weight:500;
    font-style:italic;
  }
  cjt {
    color:white;
    font-weight:500;
    font-style:italic;
    letter-spacing:1.8px;
  }
}
