:root {
    --accent-color: darkslateblue;
    --button-color:#464657;
    --link-color: mediumpurple;
    --bg-color: #fff;
    --bg-color2: #272343;
    --text-color: violet;
    --text-color2: white;
    --text-color3: #94BBE9;
    --text-effect: rgba(255, 255, 255, 0.5); 
}

* {
    color: var(--text-color);
    font-family: Knewave;
    box-sizing: border-box;
}

.knewave-regular {
  font-family: "Knewave", system-ui;
  font-weight: 400;
  font-style: normal;
}

::selection {
    background: var(--accent-color);
    color: var(--bg-color);
}

a:hover {
    color: var(--accent-color);
    text-decoration: none;
}

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

body {
    margin: 0;
    background-color: var(--bg-color);
    background-image:
    linear-gradient(90deg, transparent 79px, #abced4 79px, #abced4 81px, transparent 81px),
    linear-gradient(#eee .1em, transparent .1em);
    background-size: 100% 1.2em;}

p {
    line-height: 1.5em;}

h1 {
    color: var(--accent-color);
}

h3 {
    color: var(--text-color3);
}

.underline {
  position: relative;
  white-space: nowrap;
  &:after {
    --deco-height: 0.45em;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(var(--deco-height) * -0.625);
    height: var(--deco-height);
    background-image: url('images/underline.png');
    background-size: auto 100%;
    background-repeat: round;
    background-position: 0em;
  }
}

.strike {
    text-decoration: line-through;
    text-decoration-color: var(--link-color);
    text-decoration-thickness: 0.1em;
    text-decoration-style: wavy;
}

#content {
    display: flex;
    margin-left: 100px;
}

#entries {
    margin-left: 50px;
    margin-top: 90px;
}