<?xml version="1.0"?>
<oembed><version>1.0</version><provider_name>Support | Kriesi.at - Premium WordPress Themes</provider_name><provider_url>https://kriesi.at/support</provider_url><author_name>dwiandi</author_name><author_url>https://kriesi.at/support/author/dwiandi/</author_url><title>Create custom overlay - Support | Kriesi.at - Premium WordPress Themes</title><type>rich</type><width>600</width><height>338</height><html>&lt;blockquote class="wp-embedded-content" data-secret="LKWDX9JPhc"&gt;&lt;a href="https://kriesi.at/support/topic/create-custom-overlay/"&gt;Create custom overlay&lt;/a&gt;&lt;/blockquote&gt;&lt;iframe sandbox="allow-scripts" security="restricted" src="https://kriesi.at/support/topic/create-custom-overlay/embed/#?secret=LKWDX9JPhc" width="600" height="338" title="&#x201C;Create custom overlay&#x201D; &#x2014; Support | Kriesi.at - Premium WordPress Themes" data-secret="LKWDX9JPhc" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" class="wp-embedded-content"&gt;&lt;/iframe&gt;&lt;script type="text/javascript"&gt;
/* &lt;![CDATA[ */
/*! This file is auto-generated */
!function(d,l){"use strict";l.querySelector&amp;&amp;d.addEventListener&amp;&amp;"undefined"!=typeof URL&amp;&amp;(d.wp=d.wp||{},d.wp.receiveEmbedMessage||(d.wp.receiveEmbedMessage=function(e){var t=e.data;if((t||t.secret||t.message||t.value)&amp;&amp;!/[^a-zA-Z0-9]/.test(t.secret)){for(var s,r,n,a=l.querySelectorAll('iframe[data-secret="'+t.secret+'"]'),o=l.querySelectorAll('blockquote[data-secret="'+t.secret+'"]'),c=new RegExp("^https?:$","i"),i=0;i&lt;o.length;i++)o[i].style.display="none";for(i=0;i&lt;a.length;i++)s=a[i],e.source===s.contentWindow&amp;&amp;(s.removeAttribute("style"),"height"===t.message?(1e3&lt;(r=parseInt(t.value,10))?r=1e3:~~r&lt;200&amp;&amp;(r=200),s.height=r):"link"===t.message&amp;&amp;(r=new URL(s.getAttribute("src")),n=new URL(t.value),c.test(n.protocol))&amp;&amp;n.host===r.host&amp;&amp;l.activeElement===s&amp;&amp;(d.top.location.href=t.value))}},d.addEventListener("message",d.wp.receiveEmbedMessage,!1),l.addEventListener("DOMContentLoaded",function(){for(var e,t,s=l.querySelectorAll("iframe.wp-embedded-content"),r=0;r&lt;s.length;r++)(t=(e=s[r]).getAttribute("data-secret"))||(t=Math.random().toString(36).substring(2,12),e.src+="#?secret="+t,e.setAttribute("data-secret",t)),e.contentWindow.postMessage({message:"ready",secret:t},"*")},!1)))}(window,document);
/* ]]&gt; */
&lt;/script&gt;
</html><description>Hi, I am trying to create a custom overlay using simple html and css. The idea is simple, when we hover on the picture, there will be an overlay with text, The problem is that the effect is affecting all the images. The overlay should only be fo each of the picture. thank you</description></oembed>
