body {
        --secondary: #545454;
        --primary: #292929;
        --bg: #f1f1f1;
        color: var(--primary);
        padding: 0;
        margin: 0;
        font-size: 14px;
        background-color: var(--bg);
        font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    }

    .no-style {
        background-color: transparent;
        margin: 0;
        padding: 0;
        border: none;
    }

    h1,
        h2,
        h3 {
            margin: 0;
            padding: 0;
        }


    .serif {
        font-family: 'Times New Roman', Times, serif;
        font-weight: 350;
    }

    .primary-btn,
    .secondary-btn {
        background-color: var(--primary);
        color: white;
        border-radius: 100em;
        --height: 43px;
        height: var(--height);
        padding: 0 14px;
        border: none;
        outline: none;
        cursor: pointer;
        align-items: center;
        display: flex;
        justify-content: center;
        text-decoration: none;
        text-align: center;
        white-space: nowrap;
        font-size: inherit;
        font-family: inherit;
    }

    .secondary-btn {
        background-color: transparent;
        color: var(--primary);
        outline: solid 3px var(--primary);
    }

    .secondary-btn:hover {
        background-color: rgb(219, 219, 219);
    }

    .secondary-btn:active {
        background-color: rgb(172, 172, 172);
    }


    .primary-btn:hover {
        opacity: 0.7;
    }

    .primary-btn:active {
        opacity: 0.5;
    }