title: show external div on hover
body: <p>i created a navigation and now i want to add a previewer to get related options.</p>
  
  <p>this div isnt connected to the navigation but it needs to show up on hover. i surrendered after "hours" of researching :/</p>
  
  <p>Here is my simplified code</p>
  
  <p><a href="https://codepen.io/solevita/pen/JXEOQg" rel="nofollow">https://codepen.io/solevita/pen/JXEOQg</a></p>
  
  <pre><code>&lt;div class="col"&gt;
    &lt;div class="content"&gt;lorem ipsum&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col"&gt;
    &lt;div class="navigation"&gt;
      &lt;ul&gt;
        &lt;li&gt;&lt;a href="#"&gt;punkt&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>as already told, the div I want to show is not in the navigation (for responsive reasons).</p>
  
  <p>Is it possible to handle this with pure css or is javascript necessary? I hope this is not the case - my javascript skills are not existent :D</p>
  
  <p>thanks for your help!</p>