div.pages svg {
    width: 100px;
    margin: 5px;
    cursor: pointer; 
}

div.pages {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -5px;
    align-content: space-between;
}

div.pages svg .border {
    fill: none;
    stroke: #666666;
    stroke-width: 3;
}

div.pages svg:hover .border {
    fill: none;
    stroke: #666666;
    stroke-width: 10;
}

div.pages svg .block {
    fill: #bcbcbc;
    stroke: none;
}


.active-topic-0 svg .block.is-topic-0,
.active-topic-1 svg .block.is-topic-1,
.active-topic-2 svg .block.is-topic-2,
.active-topic-3 svg .block.is-topic-3,
.active-topic-4 svg .block.is-topic-4,
.active-topic-5 svg .block.is-topic-5,
.active-topic-6 svg .block.is-topic-6,
.active-topic-7 svg .block.is-topic-7,
.active-topic-8 svg .block.is-topic-8,
.active-topic-9 svg .block.is-topic-9,
.active-topic-10 svg .block.is-topic-10,
.active-topic-11 svg .block.is-topic-11,
.active-topic-12 svg .block.is-topic-12,
.active-topic-13 svg .block.is-topic-13,
.active-topic-14 svg .block.is-topic-14,
.active-topic-15 svg .block.is-topic-15 {
    fill: red !important;
}

.active-topic-0 svg .border.has-topic-0,
.active-topic-1 svg .border.has-topic-1,
.active-topic-2 svg .border.has-topic-2,
.active-topic-3 svg .border.has-topic-3,
.active-topic-4 svg .border.has-topic-4,
.active-topic-5 svg .border.has-topic-5,
.active-topic-6 svg .border.has-topic-6,
.active-topic-7 svg .border.has-topic-7,
.active-topic-8 svg .border.has-topic-8,
.active-topic-9 svg .border.has-topic-9,
.active-topic-10 svg .border.has-topic-10,
.active-topic-11 svg .border.has-topic-11,
.active-topic-12 svg .border.has-topic-12,
.active-topic-13 svg .border.has-topic-13,
.active-topic-14 svg .border.has-topic-14,
.active-topic-15 svg .border.has-topic-15 {
    stroke: red !important;
}

.fullwidth {
    width: 100%;
}

.active-topic-0 p.is-topic-0,
.active-topic-1 p.is-topic-1,
.active-topic-2 p.is-topic-2,
.active-topic-3 p.is-topic-3,
.active-topic-4 p.is-topic-4,
.active-topic-5 p.is-topic-5,
.active-topic-6 p.is-topic-6,
.active-topic-7 p.is-topic-7,
.active-topic-8 p.is-topic-8,
.active-topic-9 p.is-topic-9,
.active-topic-10 p.is-topic-10,
.active-topic-11 p.is-topic-11,
.active-topic-12 p.is-topic-12,
.active-topic-13 p.is-topic-13,
.active-topic-14 p.is-topic-14,
.active-topic-15 p.is-topic-15 {
    background-color: #F2B7C6;
}

.active-topic-0 span.is-topic-0,
.active-topic-1 span.is-topic-1,
.active-topic-2 span.is-topic-2,
.active-topic-3 span.is-topic-3,
.active-topic-4 span.is-topic-4,
.active-topic-5 span.is-topic-5,
.active-topic-6 span.is-topic-6,
.active-topic-7 span.is-topic-7,
.active-topic-8 span.is-topic-8,
.active-topic-9 span.is-topic-9,
.active-topic-10 span.is-topic-10,
.active-topic-11 span.is-topic-11,
.active-topic-12 span.is-topic-12,
.active-topic-13 span.is-topic-13,
.active-topic-14 span.is-topic-14,
.active-topic-15 span.is-topic-15 {
    background-color: #DD9296;
}


.matches-only section.document {
    display: none;
}

.matches-only.active-topic-0 section.document.has-topic-0,
.matches-only.active-topic-1 section.document.has-topic-1,
.matches-only.active-topic-2 section.document.has-topic-2,
.matches-only.active-topic-3 section.document.has-topic-3,
.matches-only.active-topic-4 section.document.has-topic-4,
.matches-only.active-topic-5 section.document.has-topic-5,
.matches-only.active-topic-6 section.document.has-topic-6,
.matches-only.active-topic-7 section.document.has-topic-7,
.matches-only.active-topic-8 section.document.has-topic-8,
.matches-only.active-topic-9 section.document.has-topic-9,
.matches-only.active-topic-10 section.document.has-topic-10,
.matches-only.active-topic-11 section.document.has-topic-11,
.matches-only.active-topic-12 section.document.has-topic-12,
.matches-only.active-topic-13 section.document.has-topic-13,
.matches-only.active-topic-14 section.document.has-topic-14,
.matches-only.active-topic-15 section.document.has-topic-15 {
    display: block;
}