main {
    width: var(--content-width);
    margin: var(--content-margin);
    display: flex;
    flex-direction: column;
    gap: 24px;
    position: relative;
    word-wrap: break-word;

    #article-header {
        padding-bottom: 12px;
        border-bottom: 1px solid var(--primary-medium-color);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;

        #article-header-back {
            display: var(--content-back-home-display);
            flex-direction: row;
            align-items: center;
            gap: .5rem;
            text-transform: uppercase;
            text-decoration: none;

            span {
                font-family: var(--font-barlow-condensed);
                font-style: italic;
                font-weight: 900;
                color: var(--color-white);
                font-size: 16px;
            }
        }


        #reading-time {
        display: flex;
        flex-direction: row;
        gap: .5rem;
        text-transform: uppercase;

        #reading-time-clock-font-primary, #reading-time-clock {
            width: 14px;
        }

        #reading-time-clock {
            display: var(--content-reading-clock-display);
        }

        #reading-time-clock-font-primary {
            display: var(--content-reading-clock-primary-display);
        }

        span {
            font-family: var(--font-barlow-condensed);
            font-style: italic;
            font-weight: 700;
            color: var(--content-header-color);
            font-size: 12px;
        }
    }}

    #title {
        font-family: var(--font-barlow-condensed);
        font-weight: 900;
        font-size: 48px;
        font-style: italic;
        margin: 0;
        color: var(--content-header-color);
    }

    #description {
        font-family: var(--font-barlow);
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        color: var(--content-header-color);
        letter-spacing: calc(16px*(3)/100);
        margin: 0;
    }

    #featured-picture {
        width: 100%;
        border-radius: var(--primary-border-radius);
        overflow: hidden;
    }

    h2, h3, h4, h5, h6, p, li {
        margin: 0;
        color: var(--primary-font);
    }

    h2, h3, h4, h5, h6 {
        font-family: var(--font-barlow-condensed);
        font-style: italic;
    }

    h2, h3, h4, h5 {
        font-family: var(--font-barlow-condensed);
        font-style: italic;
        font-weight: 900;
        line-height: 110%;
    }

    h2 {
        font-size: var(--content-h2-size);
    }

    h3 {
        font-size: var(--content-h3-size);
    }

    h4 {
        font-size: var(--content-h4-size);
    }

    h5 {
        font-size: var(--content-h5-size);
    }

    p, li {
        font-family: var(--font-barlow);
        font-size: 16px;
        font-weight: 500;
        line-height: 150%;
        letter-spacing: calc(16px*(3)/100);

        cite {
            font-weight: 300;
            padding-left: 20px;
            display: inline-block;
            position: relative;
            font-size: 18px;
            letter-spacing: calc(16px*(3)/100);
            line-height: 150%;

            &::after {
                border-radius: var(--primary-border-radius);
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                bottom: 0;
                width: 4px;
                background-color: var(--primary-color);
            }
        }

        a {
            color: var(--primary-font);
            font-weight: 700;
            text-decoration: none;

            &:hover {
                text-decoration: underline;
            }

            &[href*="/nos-forets-envoient-du-bois"] {
                color: var(--color-internal-link);
                font-style: italic;
            }
        }
    }

    img {
        width: 100%;
        border-radius: var(--primary-border-radius);
        overflow: hidden;
    }

    #spacer {
        height: 32px;
    }

    #share-footer {
        padding: 24px 0;
        border-top: 1px solid var(--primary-font);
        border-bottom: 1px solid var(--primary-font);
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        font-family: var(--font-barlow);

        #share-footer-socials {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 6px;

            p {
                font-style: italic;
                font-size: 12px;
            }

            a {
                text-decoration: none;
            }
        }

        #share-footer-source {
            display: flex;
            flex-direction: row;
            align-items: baseline;

            p {
                text-transform: uppercase;
                font-size: 8px;
            }

            a {
                font-style: italic;
                font-weight: 700;
                font-size: 12px;
                text-decoration: none;
                color: var(--primary-font);
            }
        }
    }

    #title-more {
        font-family: var(--font-barlow-condensed);
        font-weight: 900;
        font-style: italic;
        font-size: 30px;
    }

    .table-of-contents {
        li a{
            font-size: 14px !important;
        }
    }
}