title: Java Script Hover on box with picture and text + switch colors
body: <p>I'm trying to make a hover on box with picture and text. </p>
  
  <p>I would like to force JS/css to change color of the box (div) and text when mouse pointer is on box ( as on image on link below ). So there should be hover on image + at the same time text on the image + change color of text and icons - calendar + comments ( or switch icons for icons with white color ).</p>
  
  <p>I tried to make hover with SVG filter and css opacity ( for image hover is working fine ), but there is problem with text color and of course with additional text on image. Also I tried Java Script with mouseover, but still nothing...</p>
  
  <p>image how it should work:</p>
  
  <pre><code>http://szkolajezykowakola.vxm.pl/st.jpg
  </code></pre>
  
  <p><strong>simple div</strong></p>
  
  <pre><code>&lt;div class="boxentry"&gt;
  </code></pre>
  
  <p><strong>Css - test for grey scale</strong></p>
  
  <pre><code>.boxentry:hover {
    filter: url("data:image/svg+xml;utf8,&lt;svg xmlns=\'http://www.w3.org/2000/svg\'&gt;&lt;filter id=\'grayscale\'&gt;&lt;feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 1 0 0 0 0 0 0 1 0\'/&gt;&lt;/filter&gt;&lt;/svg&gt;#grayscale"); 
    filter: gray; 
    -webkit-filter: grayscale(100%); 
  }
  </code></pre>