title: CSS - show div when select is checked
body: <p>I'm trying to show div when one of the selects in group is checked and hide when not. I thought this should work, but it's not working. </p>
  
  <p><a href="https://jsfiddle.net/47ctm349/2/" rel="nofollow">https://jsfiddle.net/47ctm349/2/</a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="true" data-console="true" data-babel="false">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#form-group-osobko {
    display: none;
  }
  
  #odber-1:checked+#form-group-osobko {
    display: block;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!-- Multiple Checkboxes --&gt;
  &lt;div class="form-group"&gt;
    &lt;label class="col-md-4 control-label" for="odber"&gt;Způsob platby&lt;/label&gt;
    &lt;div class="col-md-4"&gt;
      &lt;div class="checkbox"&gt;
        &lt;label for="odber-0"&gt;
          &lt;input type="checkbox" name="odber" id="odber-0" value="1"&gt; Dobírka
        &lt;/label&gt;
      &lt;/div&gt;
      &lt;div class="checkbox"&gt;
        &lt;label for="odber-1"&gt;
          &lt;input type="checkbox" name="odber" id="odber-1" value="2"&gt; Hotově při osobním odběru
        &lt;/label&gt;
      &lt;/div&gt;
      &lt;div class="checkbox"&gt;
        &lt;label for="odber-2"&gt;
          &lt;input type="checkbox" name="odber" id="odber-2" value="3"&gt; Platba předem na účet
        &lt;/label&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;!-- Text input--&gt;
  &lt;div class="form-group" id="form-group-osobko"&gt;
    &lt;label class="col-md-4 control-label" for="osobniodber"&gt;Místo osobního odběru&lt;/label&gt;
    &lt;div class="col-md-4"&gt;
      &lt;input id="osobniodber" name="osobniodber" type="text" placeholder="14900,11000" class="form-control input-md"&gt;
      &lt;span class="help-block"&gt;Zadejte PSČ míst možného osobního odběru oddělená čárkou.&lt;/span&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>It should work when you click the checkbox in the middle, the div <code>id="form-group-osobko"</code> should appear. </p>
  
  <p>I was trying not to use JS with my bootstrap. </p>
  
  <p>Can't get my head around what I'm doing wrong :(</p>
  
  <p>Thanks.</p>