/* Silver font */
@font-face {
  font-display: swap;
  font-family: 'Silver';
  src: url('/font/Silver.eot') format('embedded-opentype');
  src: url('/font/Silver.ttf') format('truetype'),
  url('/font/Silver.woff') format('woff'),
  url('/font/Silver.woff2') format('woff2'),
  url('/font/Silver.svg') format('svg');
  font-style: normal;
  font-weight: normal;
} 


body {
  font-family: 'Silver', "Arial", sans-serif;
  margin: 0;
  font-size: 28px;
  line-height: 1em;
  image-rendering: pixelated;
}

h1, h2, h3, h4, h5 {
  font-family: 'Silver', "Arial", sans-serif;
}

h3 {
  margin-bottom: 0;
  margin-top: 0;
}

ul {
  line-height: .8em;
  margin: 5px;
}

li::marker {
  content: "> ";
}

:root {
  --light: #eee;
  --dark: #18120d;
}

/* light mode*/

body {
  background-image: url("/images/assets/akibg.webp");
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* winter
background-image: url("/images/assets/monobg.webp");
*/

/* summer
background-image: url("/images/assets/natsubg.webp");
*/

/* summer
background-image: url("/images/assets/akibg.webp");
*/

.mono {
  padding: 16px;
  border-image-slice: 17;
  border-image-width: 17px;
  border-image-repeat: round;
  border-image-source: url("/images/assets/kuehnbordermono.png");
}

.natsu {
  padding: 18px;
  border-image-slice: 28;
  border-image-width: 28px;
  border-image-repeat: round;
  border-style: solid;
  border-color: transparent;
  image-rendering: pixelated;
  border-image-source: url("/images/assets/natsuborder.png");
}

.aki {
  padding: 12px; 
  background-clip: padding-box;
  border-image-slice: 24;
  border-image-width: 24px;
  border-image-repeat: round;
  border-style: solid;
  border-color: transparent;
  image-rendering: pixelated;
  border-image-source: url("/images/assets/akiborder.png");
}

/* winter
border-image-source: url("/images/assets/kuehnbordermono.png");
*/

/* summer
border-image-source: url("/images/assets/natsuborder.png");
*/

/* autumn
border-image-source: url("/images/assets/akiborder.png");
*/

a:link {
  color: var(--dark);
}

a:visited { 
  color: var(--dark);
}

/* */

main {
  width: 80%;
  margin: auto;
  margin-top: 20px;
  margin-bottom: 20px;
  display: flex;
  flex-wrap: wrap;
}

article {
  background-color: var(--light);
  color: black;
  max-height: 350px;
  margin: 5px;
  overflow-y: auto;
}

.leftcolumn {
  flex: 1 1 33%;
  vertical-align: top;
}

.middlecolumn {
  flex: 1 1 33%;
  vertical-align: top;
}

.rightcolumn {
  flex: 1 1 33%;
  vertical-align: top;
}

/* dark mode */

@media (prefers-color-scheme: dark) {
  article {
  background-color: #181818;
  color: white;
}

  body {
    background-image: url("/images/assets/akiicon.webp");
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
  }
  a:link {
  color: white;
}

a:visited { 
  color: white;
}
}

/* screenwidth */
@media screen and (max-width: 900px) {
  main {
      display:block;
  }
}