.collapsible-bar {
    margin: 10px 0;
    .collapsible-title
    {
        display: block;
        cursor: pointer;
        h3 {
            margin: 0;
        }
    }
    .collapsible-content {
        transition: opacity 0.5s ease-out;
        opacity: 0;
        height: 0;
        overflow: hidden;
        p:last-child {
            margin-bottom: 0;
        }
    }
    > input[type=checkbox],
    > input[type=radio]
    {
        display: none;
    }
    > input[type=checkbox]:checked ~ .collapsible-content,
    > input[type=radio]:checked ~ .collapsible-content
    {
        display: block;
        opacity: 1;
        height: auto;
    }
}

.collapsible-bar-show-input
{
    > input[type=checkbox],
    > input[type=radio]
    {
        display: inline-block;
        float: left;
        margin: 14px 10px;
    }
    > input[type=checkbox]:checked ~ .collapsible-content,
    > input[type=radio]:checked ~ .collapsible-content
    {
        display: block;
    }
}