.view-header {  /* the same as h4 */
    font-size: 120%;
    font-weight: normal;
    position: relative;
}

.view-header > .view-header__anchor {
    position: absolute;
    margin-left: -22px;
    display: inline-block;
    width: 22px;
    text-align: center;
    color: inherit;
    background: url(./headers-anchor.svg) center / 20px no-repeat content-box;
    padding-top: 2px;
    font-weight: normal;
    opacity: 0;
    transition: opacity .25s;
}
.view-header:hover > .view-header__anchor,
.view-header:hover > .view-header__anchor {
    opacity: 1;
}
.view-header > .view-header__anchor::before {
    content: '§';
    display: inline-block;
    width: 0;
    visibility: hidden;
}

.view-h1 {
    font-size: 220%;
    font-weight: normal;
    margin: .812em 0 .65em;
}

.view-h2 {
    font-size: 150%;
    font-weight: normal;
    margin: .78em 0;
}

.view-h3 {
    font-size: 135%;
    font-weight: normal;
    margin: .73em 0;
}

.view-h4 {
    font-size: 120%;
    font-weight: normal;
    margin: .73em 0;
}

.view-h5 {
    font-size: 110%;
    font-weight: normal;
    margin: .68em 0;
}
