.gds-markdown {
    h1,
    h2,
    h3,
    h4,
    p,
    img,
    blockquote,
    ul,
    ol {
        margin-bottom: 1rem !important;
    }

    h1 {
        font-size: ($unit * 3.5);
        line-height: 1.1;
    }

    h2 {
        font-size: ($unit * 2.5);
        line-height: 1.2;
    }

    h3 {
        font-size: ($unit * 1.8);
        line-height: 1.3;
    }

    h4 {
        font-size: ($unit * 1.5);
        line-height: 1.4;
    }

    hr {
        margin-top: 2rem !important;
        margin-bottom: 2rem !important;
    }

    p {
        font-size: $font-size;
    }

    a {
        color: $primaryColor;

        &:hover {
            text-decoration: underline;
            color: $primaryLight2Color;
        }
    }

    img {
        display: block;
        max-width: 100%;
        height: auto;
        border: 1px solid rgba(black, 0.1);
    }

    blockquote {
        padding-left: ($unit * 2);
        border-left: 6px solid $trans-black-x-light;
    }

    ul li {
        &:before {
            content: '';
            display: inline-block;
            margin-right: $unit;
            height: $unit * 0.25;
            width: $unit * 0.25;
            border-radius: 50%;
            background-color: transparent;
            border: 1px solid $primaryColor;
            vertical-align: middle;
        }
        margin-left: 1rem !important;
    }

    ol li {
        counter-increment: step-counter;
        margin-bottom: $unit * 0.5;
        &:before {
            content: counter(step-counter);
            margin-right: $unit;
            font-size: 80%;
            height: $unit * 1.5;
            width: $unit * 1.5;
            border-radius: 50%;
            border: 1px solid $primaryColor;
            text-align: center;
            display: inline-block;
            vertical-align: top;
            margin-top: 1px;
            color: $primaryColor;
        }
        margin-left: 1rem !important;
    }

    code {
        font-family: Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
        border-radius: $border-radius;
        font-size: 80%;
        padding: 0.2rem 0.4rem;
        color: $dangerDark2Color;
        background-color: #f7f7f9;
        overflow-wrap: break-word;
        word-wrap: break-word;
    }

    // Bold
    strong {
        font-family: $pri-font-semibold;
        font-weight: $font-weight-bold;
    }

    // Italic
    em {
        font-style: italic;
    }
}