#anchorlinks { margin-top: auto; font-size: 16px; line-height: 1.2; padding-top:1em;  }
#anchorlinks h2 {   font-size: inherit; white-space: nowrap;
    font-weight: 700; line-height: inherit;  margin: 0.5em 0.5em 0.5em 0 !important;   }
#anchors { display: flex; flex-wrap: wrap; align-items: center;  column-gap: 0.75em; font-size: inherit;   }
#anchors li { font-size: inherit !important; margin: 0.5em 0 !important;  line-height: 1.2 !important; }


@media (prefers-color-scheme: dark) {

    #anchors li a:is(:hover,:focus-visible) .icon{
        color:white !important;


    }
}

#anchors li a {

background:var(--white);
border: 1px solid var(--white);
color:black;

font-weight: 600 !important;


font-size: inherit;
line-height: inherit;

vertical-align: top;

display: inline-block;
text-shadow: none;


border-radius: 300px;

  min-height:1.25em;  padding: 0.75em 1em;

transition: all 0.2s ease;

}
#anchors li a .icon { font-style: normal !important; margin-left: 0.333em;   }
#anchors li a .icon::after { content:"\E800"; font-family:esero; font-weight: normal;  font-style: normal !important;  transform: rotate(90deg); display: inline-block}

#anchors li a:is(:hover,:focus-visible) {
    background:var(--hover_blue);
    border: 1px solid var(--hover_blue);
    color:var(--black);

}


#anchors li a:is(:hover,:focus-visible) .icon{
    color:inherit !important;


}

@media all and (min-width:1200px) {
    #anchorlinks { display: flex;  gap: 0.75em; }
    #anchorlinks h2 {  padding: 0.75em 0; }

}