Portilla de submarino

<div class="uvq11-port" style="--dp:.25"><div class="ph"><div class="gl"><div class="sea" aria-hidden="true"><i class="ry"></i><span class="fs"><svg viewBox="0 0 24 12" style="top:30%;--sz:1.6em;--dl:0"><path d="M2 6c4-5 11-5 16 0-5 5-12 5-16 0zM18 6l5-4v8z"/></svg><svg viewBox="0 0 24 12" style="top:44%;--sz:3em;--dl:-3"><path d="M2 6c4-5 11-5 16 0-5 5-12 5-16 0zM18 6l5-4v8z"/></svg><svg viewBox="0 0 24 12" style="top:58%;--sz:2.2em;--dl:-6"><path d="M2 6c4-5 11-5 16 0-5 5-12 5-16 0zM18 6l5-4v8z"/></svg><svg viewBox="0 0 24 12" style="top:70%;--sz:1.1em;--dl:-2"><path d="M2 6c4-5 11-5 16 0-5 5-12 5-16 0zM18 6l5-4v8z"/></svg></span><i class="jf"></i><i class="jf b"></i><span class="sn"><i style="left:0%;--d:10.3;--dl:-8.2"></i><i style="left:96%;--d:11.6;--dl:-8.5"></i><i style="left:61%;--d:11.0;--dl:-8.3"></i><i style="left:15%;--d:11.9;--dl:-7.5"></i><i style="left:80%;--d:8.7;--dl:-7.0"></i><i style="left:89%;--d:10.3;--dl:-1.0"></i><i style="left:98%;--d:11.2;--dl:-4.3"></i><i style="left:93%;--d:9.9;--dl:-1.0"></i><i style="left:0%;--d:11.1;--dl:-2.0"></i><i style="left:50%;--d:8.4;--dl:-1.2"></i><i style="left:83%;--d:11.5;--dl:-4.1"></i><i style="left:62%;--d:9.4;--dl:-2.7"></i><i style="left:22%;--d:11.0;--dl:-8.8"></i><i style="left:75%;--d:7.3;--dl:-7.7"></i><i style="left:39%;--d:10.8;--dl:-4.7"></i><i style="left:94%;--d:7.3;--dl:-5.0"></i></span></div><i class="rim"></i><i class="rf"></i></div><i class="bt" style="--i:0"></i><i class="bt" style="--i:1"></i><i class="bt" style="--i:2"></i><i class="bt" style="--i:3"></i><i class="bt" style="--i:4"></i><i class="bt" style="--i:5"></i><i class="bt" style="--i:6"></i><i class="bt" style="--i:7"></i></div><div class="pn"><p class="lb">Profundidad</p><output class="dv">50 m</output><input type="range" min="0" max="200" value="50" aria-label="Profundidad"><p class="zn"><span class="z1">Zona iluminada</span><span class="z2">Zona crepuscular</span></p></div></div>