@font-face {
    font-family: "Century Gothic";
    src: url("../fonts/gothic.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

@keyframes logo-pulse {
    0% {
        stroke-width: 2;
        opacity: 0.3;
        filter: drop-shadow(0 0 3px hsl(171, 100%, 41%)) drop-shadow(0 0 5px hsl(171, 100%, 41%));
    }
    25% {
        stroke-width: 2;
        opacity: 0.4;
        filter: drop-shadow(0 0 5px hsl(171, 100%, 41%)) drop-shadow(0 0 5px hsl(171, 100%, 41%));
    }
    40% {
        stroke-width: 2;
        opacity: 0.6;
        filter: drop-shadow(0 0 5px hsl(171, 100%, 41%)) drop-shadow(0 0 5px hsl(171, 100%, 41%));
    }
    50% {
        stroke-width: 2;
        opacity: 0.2;
        filter: drop-shadow(0 0 5px hsl(171, 100%, 41%)) drop-shadow(0 0 5px hsl(171, 100%, 41%));
    }
    60% {
        stroke-width: 2;
        opacity: 0.7;
        filter: drop-shadow(0 0 5px hsl(171, 100%, 41%)) drop-shadow(0 0 5px hsl(171, 100%, 41%));
    }
    75% {
        stroke-width: 2;
        opacity: 0.4;
        filter: drop-shadow(0 0 5px hsl(171, 100%, 41%)) drop-shadow(0 0 5px hsl(171, 100%, 41%));
    }
    100% {
        stroke-width: 2;
        opacity: 0.3;
        filter: drop-shadow(0 0 3px hsl(171, 100%, 41%)) drop-shadow(0 0 5px hsl(171, 100%, 41%));
    }
    }

.logo-text {
    font-family: "Century Gothic";
    stroke: black;
    stroke-width: 1;
    fill: black;
    font-size: 50px;
}

.logo-pulse {
    font-family: "Century Gothic";
    stroke: hsl(171, 100%, 41%);
    stroke-width: 2;
    fill: black;  /* or none? */
    font-size: 50px;
    animation: logo-pulse 4s infinite;
}