main.css

body {
    font-family: monospace;
}

ul {
    font-family: helvetica;
}
li {
  list-style: circle;
}

.list {
  list-style: square;
}
* {
  color: var(--fontColor);
  font-family: helvetica;
}

body {
    background: var(--bg);
}
.btn {
  position: absolute;
  top: 20px;
  left: 1050px;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  border: none;
  color: var(--btnFontColor);
  background-color: var(--btnBg);
}
.btn:focus { outline-style: none; }
.light-theme {
  color: #000000;
  background: #5A5558;
}
:root {
  --green: #5A5558;
  --white: #ffffff;
  --black: #000000;
}
.light-theme {
  --bg: var(--green);
  --fontColor: var(--black);
  --btnBg: var(--black);
  --btnFontColor: var(--white);
}

.dark-theme {
  --bg: var(--black);
  --fontColor: var(--white);
  --btnBg: var(--white);
  --btnFontColor: var(--black);
}
.post {
    margin-top: 0.5em;
    margin-left: 2em;
    margin-right: 2em;
    text-align: center;
}
.post p1{
    max-width: 1200px;
    padding: .5em;
    text-align: justify;
    margin: 0;
    top: 1.25em;
}
@font-face {
    font-family: 'blanka';
    src: url('fonts/Blanka-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}
h1,h2,h3 {
    font-family: 'blanka';
    font-weight: normal;
}
@font-face {
    font-family: 'comicsansms';
    src: url('fonts/comic.ttf');
    font-weight: normal;
    font-style: normal;
}
p {
    font-family: 'comicsansms';
    font-weight: normal;
}