@font-face {
    font-family: Grimoire;
    src: url(GL-Grimoire-MinKey.otf);
}

@font-face {
    font-family: Geomancy;
    src: url(GL-Geomancy.otf);
}


body {
    /* background-blend-mode: multiply; */
    /* background: radial-gradient(circle at center, black, white, pink, white, black); */
    background: radial-gradient(pink, white, pink, white, pink);


}

h2 {
    color: #c52bf7;
    font-size: 300px;
    transition: all 0.2s ease;
    text-decoration: underline;
    text-shadow: -1px 0 5px #33E3FF, 0 1px 5px #b925be, 1px 0 5px #b925be, 0 -1px 5px #A125be;
    font-family: Grimoire;
}

h3 {
    color: #c52bf7;
    font-size: 200px;
    transition: all 0.2s ease;
    text-decoration: underline;
    text-shadow: -1px 0 5px #33E3FF, 0 1px 5px #b925be, 1px 0 5px #b925be, 0 -1px 5px #A125be;
    font-family: Geomancy;

}

#text {
    color: #c52bf7;
    font-size: 30px;
    transition: all 0.2s ease;
    text-decoration: underline;
    text-shadow: -1px 0 5px #33E3FF, 0 1px 5px #b925be, 1px 0 5px #b925be, 0 -1px 5px #A125be;
    font-family: Geomancy;
    word-wrap: pretty;
    max-width: 50vw;

}

/* Hover styles for headings and paragraphs */
p:hover,
h2:hover,
h3:hover {
    transition: all 0.2s ease;
    /* text-shadow: none; */
    mix-blend-mode: difference;

}

/* mix-blend-mode: difference;
text-decoration: underline dotted; */


img:hover {
    opacity: 0.5;
}