#slideset-5
{
   text-transform: uppercase;
}

#slideset-5 .symbol-chart-wrapper\+legend
{
   transform: translate(-50%, -50%);
   left: 50%;
   top: 50%;
   --width: 90%;
}

/* in other sets the SVG is a child of a slide
   and this is handled in symbol-chart.css */
#slideset-5  > .slide.active:not(.flyleaf) ~ .symbol-chart-wrapper\+legend > svg
{
   display: block;
}

/* hide all symbol groups [and thereby all symbols]
   individual groups are revealed in script */
#slideset-5  > .slide.active:not(.flyleaf) ~ .symbol-chart-wrapper\+legend > svg > g
{
   display: none;
}

#slideset-5  > .slide.active:not(.flyleaf) ~ .symbol-chart-wrapper\+legend > svg > g.active
{
   display: block;
}

#slideset-5 > .slide:not(.flyleaf)
{
   background-color: transparent;
}

#slideset-5 svg
{
   display: none;
   position: absolute;
}

#slideset-5 svg.active
{
   display: block;
}

/* page header */
#slideset-5 > div:first-child
{
   background-color: var(--gray2);
   color: #fff;
   letter-spacing: .25em;
   padding: .55em 2.5em;
   transform: translateX(-50%);
   left: 50%;
   top: 0;
}

#slideset-5 .slide:not(.flyleaf) > :last-child
{
   color: #f00;
   display: none;
   font-family: "gillsans-semibold";
   font-size: 2em;
   letter-spacing: .025em;
}

#slideset-5 .slide.current > :last-child
{
   display: block;
}

/* red group labels */
#slideset-5 > :nth-child(3) > :last-child { left: 14%;    top: 31%; }
#slideset-5 > :nth-child(4) > :last-child { left: 14.25%; top: 31%; }
#slideset-5 > :nth-child(5) > :last-child { left: 46.25%; top: 31%; }
#slideset-5 > :nth-child(6) > :last-child { left: 71%;    top: 31%; }
#slideset-5 > :nth-child(7) > :last-child { left: 26%;    top: 84%; }
#slideset-5 > :nth-child(8) > :last-child { left:  3%;    top: 66%; }
#slideset-5 > :nth-child(9) > :last-child { left:  3%;    top: 66%; }