/* --- ICONS --- */ .icon { color: black; text-decoration: none; font-size: 1.1rem; vertical-align: sub; } .hidden-text { height: 0; width: 0; position: absolute; overflow: hidden; } .icon .bubble { background-color: #FF1654; color: white; font-size: 0.85rem; border-radius: 50%; display: block; position: absolute; text-align: center; top: -0.65rem; right: -0.5rem; height: 1rem; width: 1rem; } /* --- TOGGLES --- */ input.toggle-control { display: none; } .toggle-content.hidden { display: none; } input.toggle-control:checked ~ .toggle-content { display: block; } /* --- STARS --- */ .rate-stars button.icon { background: none; border: none; padding: 0; margin: 0; display: inline; } .rate-stars:hover .icon:before { content: '\e9d9'; } .rate-stars form:hover ~ form .icon:before{ content: '\e9d7'; }