@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-Thin.woff2") format("woff2");
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-ThinItalic.woff2") format("woff2");
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-ExtraLight.woff2") format("woff2");
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-ExtraLightItalic.woff2") format("woff2");
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-LightItalic.woff2") format("woff2");
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-Italic.woff2") format("woff2");
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-Text.woff2") format("woff2");
    font-weight: 450;
    font-style: normal;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-TextItalic.woff2") format("woff2");
    font-weight: 450;
    font-style: italic;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-MediumItalic.woff2") format("woff2");
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-SemiBoldItalic.woff2") format("woff2");
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "IBM Plex Serif";
    src: url("/assets/fonts/ibmplexserif/IBMPlexSerif-BoldItalic.woff2") format("woff2");
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: "Bonbon";
    src: url("/assets/fonts/Bonbon-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Miniver";
    src: url("/assets/fonts/Miniver-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}

:root {
    --dark1: #57371d;
    --light1: #f0eae6;
    --white04: rgba(255, 255, 255, 0.4);
    --accent1: #e240a4;
    --accent2: #89ad3f;
    --bodyfont: "IBM Plex Serif", Georgia, "Times New Roman", Times, serif;
    --titlefont: "Bonbon", Georgia, "Times New Roman", Times, serif;
    --cursivefont: "Miniver", Georgia, "Times New Roman", Times, serif;
}

p {
    margin: 0;
}

p + p {
    margin-top: 10px;
}

h1,
h2,
h3,
h4 {
    margin-top: 0;
    margin-bottom: 0.65em;
    padding-bottom: 0.15em;
    border-bottom: 1px dashed;
}

body {
    background-color: var(--light1);
    color: var(--dark1);
    font-family: var(--bodyfont);
}

main {
    max-width: 650px;
}

a {
    color: var(--accent1);
}
