Checkbox in li element doesn't trigger css :checked

Is this impossible? I've created a responsive menu system, but the :checked event of my checkbox doesn't get caught in my css

CSS
#sectiona:checked + #asection {
    display: block;
}

HTML
<li ><label for="sectiona" class="showhide">Search for a term</label>
 <input type="checkbox" id="sectiona" value="button" style="display:none;"/>                   
</li>

I've see something like this before. If this isn't possible, I'll have to redesign my menus. It has to be HTML and CSS. No Javascript is allowed...