html[data-wcag-font="0"] {
    font-size: 14px;
    line-height: 16px;
}
html[data-wcag-font="1"] {
    font-size: 16px;
    line-height: 20px;
}
html[data-wcag-font="2"] {
    font-size: 18px;
    line-height: 24px;
}
#wcag {
    position: relative;
    z-index: 2;
    display: block;
    float: left;
    padding-left: 39px;
    font-size: 0;
}
#wcag li {
    display: block;
    float: left;
    padding: 5px;
    width: 52px;
    height: 52px;
}
#wcag a {
    display: block;
    padding: 7px;
    width: 100%;
    height: 100%;
    border: 1px solid #000000;
    cursor: pointer;
}
.contrast #wcag a.contrast-switcher .wcag-hover ,
body:not(.contrast) #wcag a.contrast-switcher .wcag-hover {
    fill: #474d57;
}
.contrast #wcag li:hover a.contrast-switcher .wcag-hover ,
body:not(.contrast) #wcag li:hover a.contrast-switcher .wcag-hover {
    fill: #ffea00;
}
.contrast #wcag li:hover a.contrast-switcher path ,
body:not(.contrast) #wcag li:hover a.contrast-switcher path {
    fill: #000;
}

.contrast #wcag li:hover a.contrast-switcher ,
body:not(.contrast) #wcag li:hover a.contrast-switcher  {
    background: #000;
}


.wcag-hover {
    stroke: #000;
}
.contrast-switcher {
    background-color: #ffea00;
}
body:not(.contrast) #wcag .active a.text-size,
body:not(.contrast) #wcag a.text-size:hover,
body:not(.contrast) #wcag a.text-size:focus {
    background-color: #1d8fb2;
}
body:not(.contrast) #wcag a.text-size:hover svg path,
body:not(.contrast) #wcag a.text-size:focus svg path {
    fill: #000;
}
body:not(.contrast) #wcag a:hover .wcag-hover,
body:not(.contrast) #wcag a:focus .wcag-hover {
    fill: #000;
}
.contrast #wcag a {
    border-color: #ffea00;
}
.contrast #wcag li:hover a.text-size,
.contrast #wcag li:focus a.text-size,
.contrast #wcag .active a,
.contrast #wcag .active a svg {
    background: #ffea00;
}
.contrast #wcag .active a svg path {
    fill: #000 !important;
}