Javascript Mouse Over + Mouse Out - Optimize between to Symbols
I try to describe it as best as possible.
I have a dog's paw, information should be shown and hidden with Javascript Mouse Over and Mouse Out. If the mouse is directly on a symbol, then only one piece of information appears, and that's what I would like to have.
The problem: If you move the mouse between the symbols, unfortunately information from the two symbols appears.
Can someone please tell me why this is and how to fix it?
Thanks in advance
Screenshot:
Run the snippet in full screen to see the issue
// Mouse over
document.getElementById("item-email").onmouseover = function() {
mouseOver1();
};
document.getElementById("item-standort").onmouseover = function() {
mouseOver2();
};
document.getElementById("item-telefon").onmouseover = function() {
mouseOver3();
};
document.getElementById("item-socialmedia").onmouseover = function() {
mouseOver4();
};
function mouseOver1() {
document.getElementById("text-email").style.display = "block";
}
function mouseOver2() {
document.getElementById("text-standort").style.display = "block";
}
function mouseOver3() {
document.getElementById("text-telefon").style.display = "block";
}
function mouseOver4() {
document.getElementById("text-socialmedia").style.display = "block";
}
document.getElementById("item-email").onmouseout = function() {
mouseOut1();
};
document.getElementById("item-standort").onmouseout = function() {
mouseOut2();
};
document.getElementById("item-telefon").onmouseout = function() {
mouseOut3();
};
document.getElementById("item-socialmedia").onmouseout = function() {
mouseOut4();
};
// Mouse out
function mouseOut1() {
document.getElementById("text-telefon").style.display = "none";
document.getElementById("text-standort").style.display = "none";
document.getElementById("text-socialmedia").style.display = "none";
}
function mouseOut2() {
document.getElementById("text-email").style.display = "none";
document.getElementById("text-telefon").style.display = "none";
document.getElementById("text-socialmedia").style.display = "none";
}
function mouseOut3() {
document.getElementById("text-email").style.display = "none";
document.getElementById("text-standort").style.display = "none";
document.getElementById("text-socialmedia").style.display = "none";
}
function mouseOut4() {
document.getElementById("text-telefon").style.display = "none";
document.getElementById("text-email").style.display = "none";
document.getElementById("text-standort").style.display = "none";
}@media all and (min-width:640px) {
#ah-pfote-container {
-webkit-transform: scale(.5) translatex(150px);
-ms-transform: scale(.5) translatex(150px);
transform: scale(.5) translatex(150px);
-webkit-transition: all 1.1s ease;
-o-transition: all 1.1s ease;
transition: all 1.1s ease;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='294.62' height='317.79' viewBox='0 0 294.62 317.79'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23f09205;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3EElement 1%3C/title%3E%3Cg id='Ebene_2' data-name='Ebene 2'%3E%3Cg id='Ebene_1-2' data-name='Ebene 1'%3E%3Cg id='Ebene_2-2' data-name='Ebene 2'%3E%3Cg id='symbol-pfote'%3E%3Cpath class='cls-1' d='M42.92,176.71c27.1-5,51.8,4.9,55.3,22.2s-15.6,35.2-42.5,40.1-51.8-5-55.3-22.3C-3.08,199.61,15.92,181.71,42.92,176.71Z'/%3E%3Cpath class='cls-1' d='M42.92,141c27.1,5,51.8-4.9,55.3-22.2s-15.6-35.2-42.5-40.2c-27.1-5-51.8,4.9-55.3,22.2S15.92,136.11,42.92,141Z'/%3E%3Cpath class='cls-1' d='M80.58,64.15c22.39,16.06,49,17.62,59.48,3.46s.87-38.49-21.34-54.47C96.33-2.92,69.76-4.48,59.23,9.68S58.23,48.22,80.58,64.15Z'/%3E%3Cpath class='cls-1' d='M118.7,304.65c-22.39,16.06-49,17.62-59.49,3.46s-.87-38.49,21.34-54.47c22.4-16.06,49-17.62,59.49-3.46S141.05,288.72,118.7,304.65Z'/%3E%3Cg id='Ebene_2-2-2' data-name='Ebene 2-2'%3E%3Cg id='symbol-pfote-2'%3E%3Cpath class='cls-1' d='M282.41,54.58c30.36,30.36-6.93,79.07-6.93,105.51s38,74.46,6.93,105.51c-35.9,34.75-170.61-4.16-170.61-105.51C111.68,55.62,246.28,20.06,282.41,54.58Z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
background-position: right center;
background-repeat: no-repeat;
background-size: contain;
position: fixed !important;
top: 20%;
right: -40px;
width: 18.75em;
height: 20em;
z-index: 999;
}
#ah-pfote-container:hover {
-webkit-transform: scale(1) translatex(-90px);
-ms-transform: scale(1) translatex(-90px);
transform: scale(1) translatex(-90px);
}
#ah-pfote-container p {
font-family: Arial, Verdana
}
.ah-pfote-wrapper {
position: relative;
}
#item-telefon,
#item-email,
#item-standort,
#item-socialmedia {}
#item-telefon {
height: 36px;
width: 2.15em;
position: absolute;
top: 22px;
left: 85px;
}
#item-email {
height: 25px;
width: 2.2em;
position: absolute;
top: 98px;
left: 34px;
}
#item-standort {
height: 37px;
width: 1.9em;
position: absolute;
top: 192px;
left: 39px;
}
#item-socialmedia {
height: 36px;
width: 42px;
position: absolute;
top: 267px;
left: 84px;
}
#item-output {
width: 9.3em;
height: 10em;
position: absolute;
top: 83px;
right: 5px
}
.ah-flexbox {
display: flex;
justify-content: center;
align-content: center;
}
.symbol-fill {
color: #000000;
}
.symbol-fill:hover {
color: #ffffff;
}
.symbol-ctr {
display: block;
margin: 0 auto 1px auto;
}
#item-display {
display: none;
}
#text-email {
display: none;
color: #fff;
padding: 0;
font-size: 1em;
}
#text-standort {
display: none;
color: #fff;
padding: 0;
font-size: 1em;
}
#text-telefon {
display: none;
color: #fff;
padding: 0;
font-size: 1em;
}
#text-socialmedia {
display: none;
color: #fff;
padding: 0;
font-size: 1em;
}
#text-telefon a,
#text-standort a,
#text-socialmedia a,
#text-email a {
color: #ffffff;
padding: 0;
margin: 0;
}
}<div id="ah-pfote-container">
<div class="ah-pfote-wrapper">
<!-- OUTPUT right div -->
<div id="item-output">
<div class="ah-flexbox">
<p id="text-email">
<svg class="symbol-ctr" xmlns="http://www.w3.org/2000/svg" width="78.63" height="44.99" viewBox="0 0 99 69">
<title>E-Mail</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="#ffffff" d="M35.82,44.7h-1.3a4.23,4.23,0,0,1-1.2-.4,3.53,3.53,0,0,1-1.6-1.8,2.66,2.66,0,0,1-.3-1.2,4.48,4.48,0,0,0-.1-1.1,18.48,18.48,0,0,0-.1-2.3c0-1.7-.1-3.8-.1-6.6V25.1a4.14,4.14,0,0,1,.5-1.9,4.08,4.08,0,0,1,3.6-2.1c17.1,0,16.7.1,26.2.5.4,0,.4,1.1,0,1.1-10.2.5-15,.5-26.2.5a2,2,0,0,0-1.9,1.5c-.1.3,0,1.1-.1,1.7v1.9c0,2.5,0,4.8-.1,6.9s-.1,4.2-.2,6.1a2.34,2.34,0,0,0,.8,1.8,2.62,2.62,0,0,0,.9.5.9.9,0,0,0,.5.1l.6.1c.4-.1.4.9.1.9"/>
<path fill="#ffffff" d="M62.12,21.5a3.74,3.74,0,0,1,3.5,3.2,4.1,4.1,0,0,0,.1,1.1v1a18.48,18.48,0,0,0,.1,2.3c0,1.7.1,3.8.1,6.6v5.5c0,.3-.1.6-.1,1a4.25,4.25,0,0,1-1,1.7A4.18,4.18,0,0,1,63,45a4.25,4.25,0,0,1-1.1.2H43.72c-1.7,0-3-.1-4.3-.2a14.92,14.92,0,0,1-2.1-.2c-.4,0-.8-.1-1.2-.1a3.9,3.9,0,0,1-1.4-.2c-.4-.1-.1-1.1.2-1.1a8.08,8.08,0,0,0,1.5-.1c.5,0,1.1-.1,1.6-.1,1,0,2-.1,3-.1,2-.1,3.9-.1,6-.2,4.1-.1,8.4-.1,14.1-.1H62a1.42,1.42,0,0,0,.6-.2,2,2,0,0,0,.9-.9,1.42,1.42,0,0,0,.2-.6V38.4c0-2.5,0-4.8.1-6.9s.1-4.2.2-6.1V24.2a2.39,2.39,0,0,0-.3-.9,2.49,2.49,0,0,0-1.6-1.1c-.4.3-.5-.7,0-.7"/>
<path fill="#ffffff" d="M60.22,27.4c-1.3,1.3-2,2.1-3.4,3.5-.7.7-1.6,1.5-2.8,2.6q-.9.75-2.1,1.8c-1,.8-2.1,1.8-3.3,2.9l-.1.1c-2.3-2-3.9-3.4-5-4.4a21.52,21.52,0,0,1-2.1-2c-1.1-1-1.8-1.9-4.3-4.6-.1-.1.4-.7.5-.6,2.2,1.7,4,2.9,5.7,4.3.9.7,1.8,1.4,2.7,2.2.7.6,1.6,1.3,2.5,2.2,1-.8,1.9-1.6,2.8-2.3,1.1-.9,2.1-1.7,3.1-2.5,2-1.5,3.7-2.8,5.2-3.8.2-.1.7.5.6.6"/>
</g>
</g>
</svg> mail@mail.de
</p>
<p id="text-standort">
<a href="#" title="Google Maps" target="_blank">
<svg class="symbol-ctr" xmlns="http://www.w3.org/2000/svg" width="78.63" height="44.85" viewBox="0 0 99 65">
<title>Standort</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="#ffffff" d="M50.24,21.08a7.24,7.24,0,0,1,2.79.46,5.45,5.45,0,0,1,2.44,2,6.25,6.25,0,0,1,.93,4.88,6.32,6.32,0,0,1-1.86,3.25A7,7,0,0,1,50,33.4a6.63,6.63,0,0,1-4.29-1.63,6.87,6.87,0,0,1-1.86-2.67,6.62,6.62,0,0,1-.12-4,6.74,6.74,0,0,1,1.63-2.56,10.92,10.92,0,0,1,1.74-1.16A5.09,5.09,0,0,1,49.89,21c.23,0,.23.47,0,.47a4.54,4.54,0,0,0-3.25,1.86,4.86,4.86,0,0,0-.93,3,4.3,4.3,0,0,0,1.16,2.79A4.18,4.18,0,0,0,50,30.49a4.47,4.47,0,0,0,3.37-1.63,4.21,4.21,0,0,0,1.05-3.25,4.94,4.94,0,0,0-4.18-4.3c-.24.23-.24-.23,0-.23"/>
<path fill="#ffffff" d="M50.59,13A14.72,14.72,0,0,1,58,15a13.65,13.65,0,0,1,5.46,6.16,15.12,15.12,0,0,1,1.28,5.46,23.81,23.81,0,0,1-1,7.08,26,26,0,0,1-4.3,8,28.94,28.94,0,0,1-3.61,4.07c-.69.7-1.39,1.28-2.2,2a5.19,5.19,0,0,1-1.28.93l-.7.47a2.32,2.32,0,0,1-1.51.46,2.35,2.35,0,0,1-1.39-.46,23.76,23.76,0,0,1-2.56-2c-.7-.58-1.39-1.28-2.09-1.86a40.83,40.83,0,0,1-3.25-3.71A28.75,28.75,0,0,1,37,35a20.55,20.55,0,0,1-1.51-9.41,13.51,13.51,0,0,1,2.91-7.2,12.43,12.43,0,0,1,4.06-3.61,14.37,14.37,0,0,1,7.21-2c.69,0,.69.46,0,.46a12.9,12.9,0,0,0-9.76,5.35,13.18,13.18,0,0,0-2.33,9.41,22.63,22.63,0,0,0,3.72,9.76A43.27,43.27,0,0,0,45,42.46a22,22,0,0,0,2.32,2.21c.47.35.82.69,1.28,1a9.91,9.91,0,0,0,1.39.93l.12-.11.7-.47a12.94,12.94,0,0,0,1.39-1.16c.93-.81,1.75-1.51,2.56-2.32A33.16,33.16,0,0,0,59,37.46a21,21,0,0,0,3.6-11.15A12.82,12.82,0,0,0,58.72,17a12.58,12.58,0,0,0-8.25-3.72c-.58.12-.58-.34.12-.34"/>
</g>
</g>
</svg> Street 1,<br> Town
</a>
</p>
<p id="text-telefon">
<svg class="symbol-ctr" xmlns="http://www.w3.org/2000/svg" width="54.63" height="44.16" viewBox="0 0 75 65">
<title>Telefon</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="pfote_telefon">
<path fill="#ffffff" d="M45.26,39.48a32.19,32.19,0,0,0-3.73-2.37,3.64,3.64,0,0,0-2.42-.75A3.15,3.15,0,0,0,37,37.92c-.27.43.14.69.42.31a2.2,2.2,0,0,1,2.27-1.08,2.87,2.87,0,0,1,1,.53l1,.73a17.28,17.28,0,0,1,3,2.41,2.45,2.45,0,0,1,.77,2,3.9,3.9,0,0,1-.93,1.79c-1,1.22-2.06,2-4.66.87a46.18,46.18,0,0,1-5-2.5,29.91,29.91,0,0,1-6.11-4.69,42.33,42.33,0,0,1-6.17-8.12c-.35-.63-.65-1.24-.91-1.81-.13-.3-.24-.57-.34-.86L21,26.6a5.06,5.06,0,0,1-.39-2.74,2.89,2.89,0,0,1,1.18-1.7,3.81,3.81,0,0,1,1.76-.82,3,3,0,0,1,2.68,1.23l.05.06,1.32,1.54a15.66,15.66,0,0,1,1.14,1.44c.22.4.39.57.52.85a1.89,1.89,0,0,1,.23.8,2.22,2.22,0,0,1-.86,1.67c-.34.31-.06.71.35.39a2.78,2.78,0,0,0,.76-3.88,31.06,31.06,0,0,0-2.37-3.6v.06a4.88,4.88,0,0,0-2.6-2.17,4.75,4.75,0,0,0-3.58.44,5.42,5.42,0,0,0-2.66,2.72,6.17,6.17,0,0,0,0,4c.16.61.32,1.13.52,1.74a16.19,16.19,0,0,0,.75,1.77,26.86,26.86,0,0,0,1.83,3.38,43.65,43.65,0,0,0,5.12,6.46,31.32,31.32,0,0,0,8.68,6.1c.7.34,1.4.65,2.08.93l1,.42c.34.14.73.29,1.1.41a7,7,0,0,0,2.44.32,4.75,4.75,0,0,0,2.42-.83,5.91,5.91,0,0,0,1.61-1.73c.21-.33.36-.59.54-.93a4.77,4.77,0,0,0,.43-1.14,3.66,3.66,0,0,0-.28-2.5A5.37,5.37,0,0,0,45.26,39.48Z"/>
<path fill="#ffffff" d="M42.1,27.12a7.8,7.8,0,0,1,1,2.22,1.68,1.68,0,0,0,.89,0,5.75,5.75,0,0,0,.19-2.67,4.06,4.06,0,0,0-.45-1.17,7.89,7.89,0,0,0-1.5-2A7,7,0,0,0,40,22a5,5,0,0,0-1.57-.4,6.68,6.68,0,0,0-2,.21,1.72,1.72,0,0,0,0,.9,10.73,10.73,0,0,1,4.22,2.47A10.2,10.2,0,0,1,42.1,27.12Z"/>
<path fill="#ffffff" d="M50.93,24.36l-.31-1a11.39,11.39,0,0,0-.56-1.22,15.32,15.32,0,0,0-2.74-3.75,13.9,13.9,0,0,0-4.15-2.89,10.24,10.24,0,0,0-1.6-.59,6.38,6.38,0,0,0-1.29-.31,13.79,13.79,0,0,0-3.85,0c-.16,0-.15.86,0,.89a17,17,0,0,1,9.22,4.6,16.9,16.9,0,0,1,3.06,4.39,15.44,15.44,0,0,1,1.51,4.86c0,.14.88.15.89,0A13.1,13.1,0,0,0,50.93,24.36Z"/>
<path fill="#ffffff" d="M28.25,30.34a.76.76,0,0,1,.08-.59,1,1,0,0,0-.32.59,3.83,3.83,0,0,0,.15,1.58,9.42,9.42,0,0,0,1.13,2.65c.49.7,1.14,1.44,1.14,1.44s.64.72,1.27,1.32a7.54,7.54,0,0,0,2.6,1.4,2.57,2.57,0,0,0,1.6,0,1.53,1.53,0,0,0,.55-.39,1.57,1.57,0,0,1-.6.16A2.14,2.14,0,0,1,34.6,38a13.75,13.75,0,0,1-1.86-1.8A16.09,16.09,0,0,1,31.56,35s-.55-.63-1-1.32c-.24-.33-1.06-1.18-1.66-2.08A3.66,3.66,0,0,1,28.25,30.34Z"/>
</g>
</g>
</svg>
<a href="tel:08004444668" title="0 800 000 000">0 800 000 000</a> </p>
<p id="text-socialmedia">Social Media</p>
</div>
</div>
<!-- Icons left -->
<div id="item-telefon">
<a href="tel:0800000000" title="080000000">
<svg id="symbol-telefon" class="symbol-fill" xmlns="http://www.w3.org/2000/svg" width="76" height="65" viewBox="18 13 75 65">
<title>Telefon</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="pfote_telefon">
<path fill="currentColor" d="M45.26,39.48a32.19,32.19,0,0,0-3.73-2.37,3.64,3.64,0,0,0-2.42-.75A3.15,3.15,0,0,0,37,37.92c-.27.43.14.69.42.31a2.2,2.2,0,0,1,2.27-1.08,2.87,2.87,0,0,1,1,.53l1,.73a17.28,17.28,0,0,1,3,2.41,2.45,2.45,0,0,1,.77,2,3.9,3.9,0,0,1-.93,1.79c-1,1.22-2.06,2-4.66.87a46.18,46.18,0,0,1-5-2.5,29.91,29.91,0,0,1-6.11-4.69,42.33,42.33,0,0,1-6.17-8.12c-.35-.63-.65-1.24-.91-1.81-.13-.3-.24-.57-.34-.86L21,26.6a5.06,5.06,0,0,1-.39-2.74,2.89,2.89,0,0,1,1.18-1.7,3.81,3.81,0,0,1,1.76-.82,3,3,0,0,1,2.68,1.23l.05.06,1.32,1.54a15.66,15.66,0,0,1,1.14,1.44c.22.4.39.57.52.85a1.89,1.89,0,0,1,.23.8,2.22,2.22,0,0,1-.86,1.67c-.34.31-.06.71.35.39a2.78,2.78,0,0,0,.76-3.88,31.06,31.06,0,0,0-2.37-3.6v.06a4.88,4.88,0,0,0-2.6-2.17,4.75,4.75,0,0,0-3.58.44,5.42,5.42,0,0,0-2.66,2.72,6.17,6.17,0,0,0,0,4c.16.61.32,1.13.52,1.74a16.19,16.19,0,0,0,.75,1.77,26.86,26.86,0,0,0,1.83,3.38,43.65,43.65,0,0,0,5.12,6.46,31.32,31.32,0,0,0,8.68,6.1c.7.34,1.4.65,2.08.93l1,.42c.34.14.73.29,1.1.41a7,7,0,0,0,2.44.32,4.75,4.75,0,0,0,2.42-.83,5.91,5.91,0,0,0,1.61-1.73c.21-.33.36-.59.54-.93a4.77,4.77,0,0,0,.43-1.14,3.66,3.66,0,0,0-.28-2.5A5.37,5.37,0,0,0,45.26,39.48Z"/>
<path fill="currentColor" d="M42.1,27.12a7.8,7.8,0,0,1,1,2.22,1.68,1.68,0,0,0,.89,0,5.75,5.75,0,0,0,.19-2.67,4.06,4.06,0,0,0-.45-1.17,7.89,7.89,0,0,0-1.5-2A7,7,0,0,0,40,22a5,5,0,0,0-1.57-.4,6.68,6.68,0,0,0-2,.21,1.72,1.72,0,0,0,0,.9,10.73,10.73,0,0,1,4.22,2.47A10.2,10.2,0,0,1,42.1,27.12Z"/>
<path fill="currentColor" d="M50.93,24.36l-.31-1a11.39,11.39,0,0,0-.56-1.22,15.32,15.32,0,0,0-2.74-3.75,13.9,13.9,0,0,0-4.15-2.89,10.24,10.24,0,0,0-1.6-.59,6.38,6.38,0,0,0-1.29-.31,13.79,13.79,0,0,0-3.85,0c-.16,0-.15.86,0,.89a17,17,0,0,1,9.22,4.6,16.9,16.9,0,0,1,3.06,4.39,15.44,15.44,0,0,1,1.51,4.86c0,.14.88.15.89,0A13.1,13.1,0,0,0,50.93,24.36Z"/>
<path fill="currentColor" d="M28.25,30.34a.76.76,0,0,1,.08-.59,1,1,0,0,0-.32.59,3.83,3.83,0,0,0,.15,1.58,9.42,9.42,0,0,0,1.13,2.65c.49.7,1.14,1.44,1.14,1.44s.64.72,1.27,1.32a7.54,7.54,0,0,0,2.6,1.4,2.57,2.57,0,0,0,1.6,0,1.53,1.53,0,0,0,.55-.39,1.57,1.57,0,0,1-.6.16A2.14,2.14,0,0,1,34.6,38a13.75,13.75,0,0,1-1.86-1.8A16.09,16.09,0,0,1,31.56,35s-.55-.63-1-1.32c-.24-.33-1.06-1.18-1.66-2.08A3.66,3.66,0,0,1,28.25,30.34Z"/>
</g>
</g>
</svg>
</a>
</div>
<div id="item-email">
<a href="mailto:mail@mail.de" title="mail@mail.de">
<svg id="symbol-email" class="symbol-fill" xmlns="http://www.w3.org/2000/svg" width="76" height="65" viewBox="31 21 75 65">
<title>E-Mail</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="currentColor" d="M35.82,44.7h-1.3a4.23,4.23,0,0,1-1.2-.4,3.53,3.53,0,0,1-1.6-1.8,2.66,2.66,0,0,1-.3-1.2,4.48,4.48,0,0,0-.1-1.1,18.48,18.48,0,0,0-.1-2.3c0-1.7-.1-3.8-.1-6.6V25.1a4.14,4.14,0,0,1,.5-1.9,4.08,4.08,0,0,1,3.6-2.1c17.1,0,16.7.1,26.2.5.4,0,.4,1.1,0,1.1-10.2.5-15,.5-26.2.5a2,2,0,0,0-1.9,1.5c-.1.3,0,1.1-.1,1.7v1.9c0,2.5,0,4.8-.1,6.9s-.1,4.2-.2,6.1a2.34,2.34,0,0,0,.8,1.8,2.62,2.62,0,0,0,.9.5.9.9,0,0,0,.5.1l.6.1c.4-.1.4.9.1.9"/>
<path fill="currentColor" d="M62.12,21.5a3.74,3.74,0,0,1,3.5,3.2,4.1,4.1,0,0,0,.1,1.1v1a18.48,18.48,0,0,0,.1,2.3c0,1.7.1,3.8.1,6.6v5.5c0,.3-.1.6-.1,1a4.25,4.25,0,0,1-1,1.7A4.18,4.18,0,0,1,63,45a4.25,4.25,0,0,1-1.1.2H43.72c-1.7,0-3-.1-4.3-.2a14.92,14.92,0,0,1-2.1-.2c-.4,0-.8-.1-1.2-.1a3.9,3.9,0,0,1-1.4-.2c-.4-.1-.1-1.1.2-1.1a8.08,8.08,0,0,0,1.5-.1c.5,0,1.1-.1,1.6-.1,1,0,2-.1,3-.1,2-.1,3.9-.1,6-.2,4.1-.1,8.4-.1,14.1-.1H62a1.42,1.42,0,0,0,.6-.2,2,2,0,0,0,.9-.9,1.42,1.42,0,0,0,.2-.6V38.4c0-2.5,0-4.8.1-6.9s.1-4.2.2-6.1V24.2a2.39,2.39,0,0,0-.3-.9,2.49,2.49,0,0,0-1.6-1.1c-.4.3-.5-.7,0-.7"/>
<path fill="currentColor" d="M60.22,27.4c-1.3,1.3-2,2.1-3.4,3.5-.7.7-1.6,1.5-2.8,2.6q-.9.75-2.1,1.8c-1,.8-2.1,1.8-3.3,2.9l-.1.1c-2.3-2-3.9-3.4-5-4.4a21.52,21.52,0,0,1-2.1-2c-1.1-1-1.8-1.9-4.3-4.6-.1-.1.4-.7.5-.6,2.2,1.7,4,2.9,5.7,4.3.9.7,1.8,1.4,2.7,2.2.7.6,1.6,1.3,2.5,2.2,1-.8,1.9-1.6,2.8-2.3,1.1-.9,2.1-1.7,3.1-2.5,2-1.5,3.7-2.8,5.2-3.8.2-.1.7.5.6.6"/>
</g>
</g>
</svg>
</a>
</div>
<div id="item-standort">
<a href="#" title="Google Maps" target="_blank">
<svg id="symbol-standort" class="symbol-fill" xmlns="http://www.w3.org/2000/svg" width="76" height="65" viewBox="36 13 75 65">
<title>Location</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="currentColor" d="M50.24,21.08a7.24,7.24,0,0,1,2.79.46,5.45,5.45,0,0,1,2.44,2,6.25,6.25,0,0,1,.93,4.88,6.32,6.32,0,0,1-1.86,3.25A7,7,0,0,1,50,33.4a6.63,6.63,0,0,1-4.29-1.63,6.87,6.87,0,0,1-1.86-2.67,6.62,6.62,0,0,1-.12-4,6.74,6.74,0,0,1,1.63-2.56,10.92,10.92,0,0,1,1.74-1.16A5.09,5.09,0,0,1,49.89,21c.23,0,.23.47,0,.47a4.54,4.54,0,0,0-3.25,1.86,4.86,4.86,0,0,0-.93,3,4.3,4.3,0,0,0,1.16,2.79A4.18,4.18,0,0,0,50,30.49a4.47,4.47,0,0,0,3.37-1.63,4.21,4.21,0,0,0,1.05-3.25,4.94,4.94,0,0,0-4.18-4.3c-.24.23-.24-.23,0-.23"/>
<path fill="currentColor" d="M50.59,13A14.72,14.72,0,0,1,58,15a13.65,13.65,0,0,1,5.46,6.16,15.12,15.12,0,0,1,1.28,5.46,23.81,23.81,0,0,1-1,7.08,26,26,0,0,1-4.3,8,28.94,28.94,0,0,1-3.61,4.07c-.69.7-1.39,1.28-2.2,2a5.19,5.19,0,0,1-1.28.93l-.7.47a2.32,2.32,0,0,1-1.51.46,2.35,2.35,0,0,1-1.39-.46,23.76,23.76,0,0,1-2.56-2c-.7-.58-1.39-1.28-2.09-1.86a40.83,40.83,0,0,1-3.25-3.71A28.75,28.75,0,0,1,37,35a20.55,20.55,0,0,1-1.51-9.41,13.51,13.51,0,0,1,2.91-7.2,12.43,12.43,0,0,1,4.06-3.61,14.37,14.37,0,0,1,7.21-2c.69,0,.69.46,0,.46a12.9,12.9,0,0,0-9.76,5.35,13.18,13.18,0,0,0-2.33,9.41,22.63,22.63,0,0,0,3.72,9.76A43.27,43.27,0,0,0,45,42.46a22,22,0,0,0,2.32,2.21c.47.35.82.69,1.28,1a9.91,9.91,0,0,0,1.39.93l.12-.11.7-.47a12.94,12.94,0,0,0,1.39-1.16c.93-.81,1.75-1.51,2.56-2.32A33.16,33.16,0,0,0,59,37.46a21,21,0,0,0,3.6-11.15A12.82,12.82,0,0,0,58.72,17a12.58,12.58,0,0,0-8.25-3.72c-.58.12-.58-.34.12-.34"/>
</g>
</g>
</svg>
</a>
</div>
<div id="item-socialmedia">
<svg id="symbol-socialmedia" class="symbol-fill" xmlns="http://www.w3.org/2000/svg" width="42" height="36" viewBox="19 17 42 37">
<title>Social Media</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="currentColor" d="M59.28,24.59a14.82,14.82,0,0,0-2.59-4.36,12.16,12.16,0,0,0-2-1.65,8.37,8.37,0,0,0-2.36-1.06,9.71,9.71,0,0,0-5.19-.36,16,16,0,0,0-7.54,4.48l-.36-.35a10.81,10.81,0,0,0-1.77-1.53c-.58-.47-1.29-.83-1.88-1.3a6.84,6.84,0,0,0-2.12-.94A8.33,8.33,0,0,0,31.1,17a10.22,10.22,0,0,0-4.6.59,11.81,11.81,0,0,0-3.89,2.6A16,16,0,0,0,20.13,24a8.44,8.44,0,0,0-.59,4.48c.35,3.07,2.24,5.66,4.25,7.79.35.35.7.59.94.82-.12.12-.24.24-.24.36a7.39,7.39,0,0,0-.59.94A2.51,2.51,0,0,0,24,40.63a3.21,3.21,0,0,0,1.18,1.3,3.1,3.1,0,0,0,2,.59,2.73,2.73,0,0,0,.36,1.88,4.35,4.35,0,0,0,1.3,1.3,2.84,2.84,0,0,0,1.65.59h.35a2.93,2.93,0,0,0,.59,2,3.24,3.24,0,0,0,1.42,1.17,3.11,3.11,0,0,0,1.76.36h.12v.23a4.08,4.08,0,0,0,.59,1.42,8,8,0,0,0,1.06.94,3.35,3.35,0,0,0,1.54.47,4.76,4.76,0,0,0,3.77-2.24,7.59,7.59,0,0,0,.94-1.18l.24-.23h0v-.12H43a3.45,3.45,0,0,0,.94.47,2.36,2.36,0,0,0,2.48-.23,3.06,3.06,0,0,0,1.29-1.89,4.78,4.78,0,0,0,.12-1.3c.12,0,.24.12.36.12a1.87,1.87,0,0,0,1.53-.35,3.22,3.22,0,0,0,1.65-2.24c.12-.36.24-1.07.12-1.07v-.35c.12,0,.23.12.35.12h.59a1.91,1.91,0,0,0,1.06-.35,1.7,1.7,0,0,0,.83-.71,2.69,2.69,0,0,0,.59-1,3.34,3.34,0,0,0,0-2.12c-.12-.35-.24-.59-.36-.94,0-.12-.11-.12-.11-.24l.35-.35a5.9,5.9,0,0,0,.83-.83A12.08,12.08,0,0,0,57.16,34a13.37,13.37,0,0,0,2-4.6A5.74,5.74,0,0,0,59.28,24.59ZM30.62,44.4c-.35,0-1.53-.82-1.17-1.53a2.24,2.24,0,0,1,.47-.71,5.74,5.74,0,0,0,.82-.94c.47-.59.83-.94,1.18-1.42.12-.11.12-.23.24-.23l.12-.12h.11a1.46,1.46,0,0,1,.71.12,3.63,3.63,0,0,1,1.18.59,1.1,1.1,0,0,1,.59,1.06l.12.12a.42.42,0,0,0-.24.12,3.64,3.64,0,0,0-.71.59,7.53,7.53,0,0,0-.94,1.06l-.12.11a3,3,0,0,1-1.18.83A2.21,2.21,0,0,1,30.62,44.4Zm3.78,3.42a1.54,1.54,0,0,1-.83-.35c-.35-.35-.59-.71-.47-1.06s.24-.47.36-.71a1.78,1.78,0,0,0,.35-.47c.12-.12.23-.35.35-.47.47-.59.83-1.06,1.18-1.42.12-.12.24-.35.47-.47l.12-.12a1.48,1.48,0,0,1,.71.12,4.42,4.42,0,0,1,1.3.59,1.25,1.25,0,0,1,.59,1.06l-.12.12-.71.71a6,6,0,0,0-.82.94l-.12.12c-.12.12-.24.23-.36.23s-.23.24-.35.24-.35.24-.47.35A1.63,1.63,0,0,1,34.4,47.82Zm6.48.83a16.41,16.41,0,0,0-1.29,1.41,2.21,2.21,0,0,1-1.54.83c-.59,0-1.41-.83-1.29-1.18A.89.89,0,0,1,37,49c.12-.11.12-.23.24-.35s.35-.35.47-.47c.47-.59.94-1.06,1.3-1.54.12-.23.35-.35.47-.59l.12-.11h0c.12-.12.59,0,.82,0a4.82,4.82,0,0,1,.83.35,2.49,2.49,0,0,1,.94.94A11.94,11.94,0,0,1,40.88,48.65ZM53.74,40a1.26,1.26,0,0,1-.71.83.93.93,0,0,1-.59.11h-.71l-.35-.11h-.12c0-.12,0-.24-.12-.24a3.27,3.27,0,0,1-.59-.35A2,2,0,0,1,50,39.8l-1.42-1.06-2.71-2.12a4.24,4.24,0,0,1-.59-.47h0l.47.71L48,39.57,49,41a3.13,3.13,0,0,0,.59.71l.59.59v.12a1.69,1.69,0,0,1-.12,1.18,2.21,2.21,0,0,1-.94,1.3,1.29,1.29,0,0,1-1.42-.12,8.22,8.22,0,0,1-1.53-1.42c-5.19-5.3-6.13-4.48-1.06.95l.83.82a2.53,2.53,0,0,0,1.06.83,3.14,3.14,0,0,1-.47,1.65c-.36.47-.71.71-.95.71a1.24,1.24,0,0,1-.82-.24c-.12-.12-.36-.24-.48-.35L43,46.41l-.12.12c0-.12-.12-.24-.24-.36A5.5,5.5,0,0,0,41.47,45a3,3,0,0,0-1.88-.59h-.36a2.78,2.78,0,0,0-.82-1.88,4.22,4.22,0,0,0-2.6-1.3H35.7a2.48,2.48,0,0,0-.83-2.12,3.89,3.89,0,0,0-2.48-1.3,1.93,1.93,0,0,0-1.06.24c-.12.11-.35.23-.47.35l-.24.24a5,5,0,0,0-.7.82c-.24.12-.36.35-.59.47a2.39,2.39,0,0,1-1.06.71c-.36.12-.71.35-1.07.24s-1.41-.83-1.06-1.54a2.44,2.44,0,0,1,.48-.7,6.31,6.31,0,0,0,.82-1,12.25,12.25,0,0,0,1.18-1.41c.47-.47.24-.36.47-.47a1.6,1.6,0,0,1,.71.11A4,4,0,0,1,31,36.5a1.11,1.11,0,0,1,.59,1.06c0,.12.71.24.82,0a2.47,2.47,0,0,0-.82-2.24A3.84,3.84,0,0,0,29.09,34a3.89,3.89,0,0,0-1.06.11c-.12.12-.35.24-.47.36l-.24.23a8.19,8.19,0,0,0-.94,1.07,3.82,3.82,0,0,1-.94.94,3.89,3.89,0,0,0-.71-.94,13.16,13.16,0,0,1-3.66-7.32c-.23-2.71,1.18-5.19,3.07-7.19a8.89,8.89,0,0,1,7.19-2.24c2.6.35,4.84,2,6.72,3.89l.36.35-2.24,2.13L34.63,27a3.47,3.47,0,0,0-.7,1.3,5.79,5.79,0,0,0-.24,1.41,2.84,2.84,0,0,0,.59,1.65,2.45,2.45,0,0,0,1.3.95,6.6,6.6,0,0,0,2.47.47,5.25,5.25,0,0,0,2.6-.59,8.85,8.85,0,0,0,1.06-.71,5,5,0,0,0,.83-.71c1.17-1.18,1.65-1.76,1.76-2.24l9.09,9.2a.11.11,0,0,1,.11.12c.12.12.24.35.36.47a2.21,2.21,0,0,1,.23.59C53.86,39.33,53.86,39.8,53.74,40ZM58,29.43a10.61,10.61,0,0,1-1.65,4l-1.41,1.77c-.24.23-.36.47-.59.59l-9.79-8c-.35-.24-.59-.24-.71-.12h0c-.7-.59-1.77.23-3.06,1.53-1.06,1.06-1.65,1.53-2.83,1.42a6.82,6.82,0,0,1-1.65-.24c-.48-.24-.48-.35-.48-.59a1.27,1.27,0,0,1,.12-.59c0-.12.12-.23.12-.35v-.12h0c-1.18-.83-.24-.24-.59-.35l.59.35h0l.12-.12a17.74,17.74,0,0,0,1.41-1.53l3-2.95h0a14.73,14.73,0,0,1,7.19-4.83,8.1,8.1,0,0,1,4.13.23,8.82,8.82,0,0,1,3.66,2.12A9.38,9.38,0,0,1,58,29.43Z"/>
</g>
</g>
</svg>
</div>
</div>
</div>
</body>Solution
You mouseout does not make too much sense. If the mouse leaves item-email you hide text-telefon, text-standort and text-socialmedia (which should already be hidden if everything works correctly) but you keep text-email visible, so it essentially does nothing.
yes, the information should be visible, because the information is a link.
What you then want to do is to do nothing on mouseout. And on mouseover hide all texts and only display the one that corresponds to the item.
// Mouse over
document.getElementById("item-email").onmouseover = mouseOver1
document.getElementById("item-standort").onmouseover = mouseOver2
document.getElementById("item-telefon").onmouseover = mouseOver3
document.getElementById("item-socialmedia").onmouseover = mouseOver4
function mouseOver1() {
hideAll();
document.getElementById("text-email").style.display = "block";
}
function mouseOver2() {
hideAll();
document.getElementById("text-standort").style.display = "block";
}
function mouseOver3() {
hideAll();
document.getElementById("text-telefon").style.display = "block";
}
function mouseOver4() {
hideAll();
document.getElementById("text-socialmedia").style.display = "block";
}
function hideAll() {
document.getElementById("text-email").style.display = "none";
document.getElementById("text-telefon").style.display = "none";
document.getElementById("text-standort").style.display = "none";
document.getElementById("text-socialmedia").style.display = "none";
}@media all and (min-width:640px) {
#ah-pfote-container {
-webkit-transform: scale(.5) translatex(150px);
-ms-transform: scale(.5) translatex(150px);
transform: scale(.5) translatex(150px);
-webkit-transition: all 1.1s ease;
-o-transition: all 1.1s ease;
transition: all 1.1s ease;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='294.62' height='317.79' viewBox='0 0 294.62 317.79'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23f09205;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3EElement 1%3C/title%3E%3Cg id='Ebene_2' data-name='Ebene 2'%3E%3Cg id='Ebene_1-2' data-name='Ebene 1'%3E%3Cg id='Ebene_2-2' data-name='Ebene 2'%3E%3Cg id='symbol-pfote'%3E%3Cpath class='cls-1' d='M42.92,176.71c27.1-5,51.8,4.9,55.3,22.2s-15.6,35.2-42.5,40.1-51.8-5-55.3-22.3C-3.08,199.61,15.92,181.71,42.92,176.71Z'/%3E%3Cpath class='cls-1' d='M42.92,141c27.1,5,51.8-4.9,55.3-22.2s-15.6-35.2-42.5-40.2c-27.1-5-51.8,4.9-55.3,22.2S15.92,136.11,42.92,141Z'/%3E%3Cpath class='cls-1' d='M80.58,64.15c22.39,16.06,49,17.62,59.48,3.46s.87-38.49-21.34-54.47C96.33-2.92,69.76-4.48,59.23,9.68S58.23,48.22,80.58,64.15Z'/%3E%3Cpath class='cls-1' d='M118.7,304.65c-22.39,16.06-49,17.62-59.49,3.46s-.87-38.49,21.34-54.47c22.4-16.06,49-17.62,59.49-3.46S141.05,288.72,118.7,304.65Z'/%3E%3Cg id='Ebene_2-2-2' data-name='Ebene 2-2'%3E%3Cg id='symbol-pfote-2'%3E%3Cpath class='cls-1' d='M282.41,54.58c30.36,30.36-6.93,79.07-6.93,105.51s38,74.46,6.93,105.51c-35.9,34.75-170.61-4.16-170.61-105.51C111.68,55.62,246.28,20.06,282.41,54.58Z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
background-position: right center;
background-repeat: no-repeat;
background-size: contain;
position: fixed !important;
top: 20%;
right: -40px;
width: 18.75em;
height: 20em;
z-index: 999;
}
#ah-pfote-container:hover {
-webkit-transform: scale(1) translatex(-90px);
-ms-transform: scale(1) translatex(-90px);
transform: scale(1) translatex(-90px);
}
#ah-pfote-container p {
font-family: Arial, Verdana
}
.ah-pfote-wrapper {
position: relative;
}
#item-telefon,
#item-email,
#item-standort,
#item-socialmedia {}
#item-telefon {
height: 36px;
width: 2.15em;
position: absolute;
top: 22px;
left: 85px;
}
#item-email {
height: 25px;
width: 2.2em;
position: absolute;
top: 98px;
left: 34px;
}
#item-standort {
height: 37px;
width: 1.9em;
position: absolute;
top: 192px;
left: 39px;
}
#item-socialmedia {
height: 36px;
width: 42px;
position: absolute;
top: 267px;
left: 84px;
}
#item-output {
width: 9.3em;
height: 10em;
position: absolute;
top: 83px;
right: 5px
}
.ah-flexbox {
display: flex;
justify-content: center;
align-content: center;
}
.symbol-fill {
color: #000000;
}
.symbol-fill:hover {
color: #ffffff;
}
.symbol-ctr {
display: block;
margin: 0 auto 1px auto;
}
#item-display {
display: none;
}
#text-email {
display: none;
color: #fff;
padding: 0;
font-size: 1em;
}
#text-standort {
display: none;
color: #fff;
padding: 0;
font-size: 1em;
}
#text-telefon {
display: none;
color: #fff;
padding: 0;
font-size: 1em;
}
#text-socialmedia {
display: none;
color: #fff;
padding: 0;
font-size: 1em;
}
#text-telefon a,
#text-standort a,
#text-socialmedia a,
#text-email a {
color: #ffffff;
padding: 0;
margin: 0;
}
}<div id="ah-pfote-container">
<div class="ah-pfote-wrapper">
<!-- OUTPUT right div -->
<div id="item-output">
<div class="ah-flexbox">
<p id="text-email">
<svg class="symbol-ctr" xmlns="http://www.w3.org/2000/svg" width="78.63" height="44.99" viewBox="0 0 99 69">
<title>E-Mail</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="#ffffff" d="M35.82,44.7h-1.3a4.23,4.23,0,0,1-1.2-.4,3.53,3.53,0,0,1-1.6-1.8,2.66,2.66,0,0,1-.3-1.2,4.48,4.48,0,0,0-.1-1.1,18.48,18.48,0,0,0-.1-2.3c0-1.7-.1-3.8-.1-6.6V25.1a4.14,4.14,0,0,1,.5-1.9,4.08,4.08,0,0,1,3.6-2.1c17.1,0,16.7.1,26.2.5.4,0,.4,1.1,0,1.1-10.2.5-15,.5-26.2.5a2,2,0,0,0-1.9,1.5c-.1.3,0,1.1-.1,1.7v1.9c0,2.5,0,4.8-.1,6.9s-.1,4.2-.2,6.1a2.34,2.34,0,0,0,.8,1.8,2.62,2.62,0,0,0,.9.5.9.9,0,0,0,.5.1l.6.1c.4-.1.4.9.1.9"/>
<path fill="#ffffff" d="M62.12,21.5a3.74,3.74,0,0,1,3.5,3.2,4.1,4.1,0,0,0,.1,1.1v1a18.48,18.48,0,0,0,.1,2.3c0,1.7.1,3.8.1,6.6v5.5c0,.3-.1.6-.1,1a4.25,4.25,0,0,1-1,1.7A4.18,4.18,0,0,1,63,45a4.25,4.25,0,0,1-1.1.2H43.72c-1.7,0-3-.1-4.3-.2a14.92,14.92,0,0,1-2.1-.2c-.4,0-.8-.1-1.2-.1a3.9,3.9,0,0,1-1.4-.2c-.4-.1-.1-1.1.2-1.1a8.08,8.08,0,0,0,1.5-.1c.5,0,1.1-.1,1.6-.1,1,0,2-.1,3-.1,2-.1,3.9-.1,6-.2,4.1-.1,8.4-.1,14.1-.1H62a1.42,1.42,0,0,0,.6-.2,2,2,0,0,0,.9-.9,1.42,1.42,0,0,0,.2-.6V38.4c0-2.5,0-4.8.1-6.9s.1-4.2.2-6.1V24.2a2.39,2.39,0,0,0-.3-.9,2.49,2.49,0,0,0-1.6-1.1c-.4.3-.5-.7,0-.7"/>
<path fill="#ffffff" d="M60.22,27.4c-1.3,1.3-2,2.1-3.4,3.5-.7.7-1.6,1.5-2.8,2.6q-.9.75-2.1,1.8c-1,.8-2.1,1.8-3.3,2.9l-.1.1c-2.3-2-3.9-3.4-5-4.4a21.52,21.52,0,0,1-2.1-2c-1.1-1-1.8-1.9-4.3-4.6-.1-.1.4-.7.5-.6,2.2,1.7,4,2.9,5.7,4.3.9.7,1.8,1.4,2.7,2.2.7.6,1.6,1.3,2.5,2.2,1-.8,1.9-1.6,2.8-2.3,1.1-.9,2.1-1.7,3.1-2.5,2-1.5,3.7-2.8,5.2-3.8.2-.1.7.5.6.6"/>
</g>
</g>
</svg> mail@mail.de
</p>
<p id="text-standort">
<a href="#" title="Google Maps" target="_blank">
<svg class="symbol-ctr" xmlns="http://www.w3.org/2000/svg" width="78.63" height="44.85" viewBox="0 0 99 65">
<title>Standort</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="#ffffff" d="M50.24,21.08a7.24,7.24,0,0,1,2.79.46,5.45,5.45,0,0,1,2.44,2,6.25,6.25,0,0,1,.93,4.88,6.32,6.32,0,0,1-1.86,3.25A7,7,0,0,1,50,33.4a6.63,6.63,0,0,1-4.29-1.63,6.87,6.87,0,0,1-1.86-2.67,6.62,6.62,0,0,1-.12-4,6.74,6.74,0,0,1,1.63-2.56,10.92,10.92,0,0,1,1.74-1.16A5.09,5.09,0,0,1,49.89,21c.23,0,.23.47,0,.47a4.54,4.54,0,0,0-3.25,1.86,4.86,4.86,0,0,0-.93,3,4.3,4.3,0,0,0,1.16,2.79A4.18,4.18,0,0,0,50,30.49a4.47,4.47,0,0,0,3.37-1.63,4.21,4.21,0,0,0,1.05-3.25,4.94,4.94,0,0,0-4.18-4.3c-.24.23-.24-.23,0-.23"/>
<path fill="#ffffff" d="M50.59,13A14.72,14.72,0,0,1,58,15a13.65,13.65,0,0,1,5.46,6.16,15.12,15.12,0,0,1,1.28,5.46,23.81,23.81,0,0,1-1,7.08,26,26,0,0,1-4.3,8,28.94,28.94,0,0,1-3.61,4.07c-.69.7-1.39,1.28-2.2,2a5.19,5.19,0,0,1-1.28.93l-.7.47a2.32,2.32,0,0,1-1.51.46,2.35,2.35,0,0,1-1.39-.46,23.76,23.76,0,0,1-2.56-2c-.7-.58-1.39-1.28-2.09-1.86a40.83,40.83,0,0,1-3.25-3.71A28.75,28.75,0,0,1,37,35a20.55,20.55,0,0,1-1.51-9.41,13.51,13.51,0,0,1,2.91-7.2,12.43,12.43,0,0,1,4.06-3.61,14.37,14.37,0,0,1,7.21-2c.69,0,.69.46,0,.46a12.9,12.9,0,0,0-9.76,5.35,13.18,13.18,0,0,0-2.33,9.41,22.63,22.63,0,0,0,3.72,9.76A43.27,43.27,0,0,0,45,42.46a22,22,0,0,0,2.32,2.21c.47.35.82.69,1.28,1a9.91,9.91,0,0,0,1.39.93l.12-.11.7-.47a12.94,12.94,0,0,0,1.39-1.16c.93-.81,1.75-1.51,2.56-2.32A33.16,33.16,0,0,0,59,37.46a21,21,0,0,0,3.6-11.15A12.82,12.82,0,0,0,58.72,17a12.58,12.58,0,0,0-8.25-3.72c-.58.12-.58-.34.12-.34"/>
</g>
</g>
</svg> Street 1,<br> Town
</a>
</p>
<p id="text-telefon">
<svg class="symbol-ctr" xmlns="http://www.w3.org/2000/svg" width="54.63" height="44.16" viewBox="0 0 75 65">
<title>Telefon</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="pfote_telefon">
<path fill="#ffffff" d="M45.26,39.48a32.19,32.19,0,0,0-3.73-2.37,3.64,3.64,0,0,0-2.42-.75A3.15,3.15,0,0,0,37,37.92c-.27.43.14.69.42.31a2.2,2.2,0,0,1,2.27-1.08,2.87,2.87,0,0,1,1,.53l1,.73a17.28,17.28,0,0,1,3,2.41,2.45,2.45,0,0,1,.77,2,3.9,3.9,0,0,1-.93,1.79c-1,1.22-2.06,2-4.66.87a46.18,46.18,0,0,1-5-2.5,29.91,29.91,0,0,1-6.11-4.69,42.33,42.33,0,0,1-6.17-8.12c-.35-.63-.65-1.24-.91-1.81-.13-.3-.24-.57-.34-.86L21,26.6a5.06,5.06,0,0,1-.39-2.74,2.89,2.89,0,0,1,1.18-1.7,3.81,3.81,0,0,1,1.76-.82,3,3,0,0,1,2.68,1.23l.05.06,1.32,1.54a15.66,15.66,0,0,1,1.14,1.44c.22.4.39.57.52.85a1.89,1.89,0,0,1,.23.8,2.22,2.22,0,0,1-.86,1.67c-.34.31-.06.71.35.39a2.78,2.78,0,0,0,.76-3.88,31.06,31.06,0,0,0-2.37-3.6v.06a4.88,4.88,0,0,0-2.6-2.17,4.75,4.75,0,0,0-3.58.44,5.42,5.42,0,0,0-2.66,2.72,6.17,6.17,0,0,0,0,4c.16.61.32,1.13.52,1.74a16.19,16.19,0,0,0,.75,1.77,26.86,26.86,0,0,0,1.83,3.38,43.65,43.65,0,0,0,5.12,6.46,31.32,31.32,0,0,0,8.68,6.1c.7.34,1.4.65,2.08.93l1,.42c.34.14.73.29,1.1.41a7,7,0,0,0,2.44.32,4.75,4.75,0,0,0,2.42-.83,5.91,5.91,0,0,0,1.61-1.73c.21-.33.36-.59.54-.93a4.77,4.77,0,0,0,.43-1.14,3.66,3.66,0,0,0-.28-2.5A5.37,5.37,0,0,0,45.26,39.48Z"/>
<path fill="#ffffff" d="M42.1,27.12a7.8,7.8,0,0,1,1,2.22,1.68,1.68,0,0,0,.89,0,5.75,5.75,0,0,0,.19-2.67,4.06,4.06,0,0,0-.45-1.17,7.89,7.89,0,0,0-1.5-2A7,7,0,0,0,40,22a5,5,0,0,0-1.57-.4,6.68,6.68,0,0,0-2,.21,1.72,1.72,0,0,0,0,.9,10.73,10.73,0,0,1,4.22,2.47A10.2,10.2,0,0,1,42.1,27.12Z"/>
<path fill="#ffffff" d="M50.93,24.36l-.31-1a11.39,11.39,0,0,0-.56-1.22,15.32,15.32,0,0,0-2.74-3.75,13.9,13.9,0,0,0-4.15-2.89,10.24,10.24,0,0,0-1.6-.59,6.38,6.38,0,0,0-1.29-.31,13.79,13.79,0,0,0-3.85,0c-.16,0-.15.86,0,.89a17,17,0,0,1,9.22,4.6,16.9,16.9,0,0,1,3.06,4.39,15.44,15.44,0,0,1,1.51,4.86c0,.14.88.15.89,0A13.1,13.1,0,0,0,50.93,24.36Z"/>
<path fill="#ffffff" d="M28.25,30.34a.76.76,0,0,1,.08-.59,1,1,0,0,0-.32.59,3.83,3.83,0,0,0,.15,1.58,9.42,9.42,0,0,0,1.13,2.65c.49.7,1.14,1.44,1.14,1.44s.64.72,1.27,1.32a7.54,7.54,0,0,0,2.6,1.4,2.57,2.57,0,0,0,1.6,0,1.53,1.53,0,0,0,.55-.39,1.57,1.57,0,0,1-.6.16A2.14,2.14,0,0,1,34.6,38a13.75,13.75,0,0,1-1.86-1.8A16.09,16.09,0,0,1,31.56,35s-.55-.63-1-1.32c-.24-.33-1.06-1.18-1.66-2.08A3.66,3.66,0,0,1,28.25,30.34Z"/>
</g>
</g>
</svg>
<a href="tel:08004444668" title="0 800 000 000">0 800 000 000</a> </p>
<p id="text-socialmedia">Social Media</p>
</div>
</div>
<!-- Icons left -->
<div id="item-telefon">
<a href="tel:0800000000" title="080000000">
<svg id="symbol-telefon" class="symbol-fill" xmlns="http://www.w3.org/2000/svg" width="76" height="65" viewBox="18 13 75 65">
<title>Telefon</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="pfote_telefon">
<path fill="currentColor" d="M45.26,39.48a32.19,32.19,0,0,0-3.73-2.37,3.64,3.64,0,0,0-2.42-.75A3.15,3.15,0,0,0,37,37.92c-.27.43.14.69.42.31a2.2,2.2,0,0,1,2.27-1.08,2.87,2.87,0,0,1,1,.53l1,.73a17.28,17.28,0,0,1,3,2.41,2.45,2.45,0,0,1,.77,2,3.9,3.9,0,0,1-.93,1.79c-1,1.22-2.06,2-4.66.87a46.18,46.18,0,0,1-5-2.5,29.91,29.91,0,0,1-6.11-4.69,42.33,42.33,0,0,1-6.17-8.12c-.35-.63-.65-1.24-.91-1.81-.13-.3-.24-.57-.34-.86L21,26.6a5.06,5.06,0,0,1-.39-2.74,2.89,2.89,0,0,1,1.18-1.7,3.81,3.81,0,0,1,1.76-.82,3,3,0,0,1,2.68,1.23l.05.06,1.32,1.54a15.66,15.66,0,0,1,1.14,1.44c.22.4.39.57.52.85a1.89,1.89,0,0,1,.23.8,2.22,2.22,0,0,1-.86,1.67c-.34.31-.06.71.35.39a2.78,2.78,0,0,0,.76-3.88,31.06,31.06,0,0,0-2.37-3.6v.06a4.88,4.88,0,0,0-2.6-2.17,4.75,4.75,0,0,0-3.58.44,5.42,5.42,0,0,0-2.66,2.72,6.17,6.17,0,0,0,0,4c.16.61.32,1.13.52,1.74a16.19,16.19,0,0,0,.75,1.77,26.86,26.86,0,0,0,1.83,3.38,43.65,43.65,0,0,0,5.12,6.46,31.32,31.32,0,0,0,8.68,6.1c.7.34,1.4.65,2.08.93l1,.42c.34.14.73.29,1.1.41a7,7,0,0,0,2.44.32,4.75,4.75,0,0,0,2.42-.83,5.91,5.91,0,0,0,1.61-1.73c.21-.33.36-.59.54-.93a4.77,4.77,0,0,0,.43-1.14,3.66,3.66,0,0,0-.28-2.5A5.37,5.37,0,0,0,45.26,39.48Z"/>
<path fill="currentColor" d="M42.1,27.12a7.8,7.8,0,0,1,1,2.22,1.68,1.68,0,0,0,.89,0,5.75,5.75,0,0,0,.19-2.67,4.06,4.06,0,0,0-.45-1.17,7.89,7.89,0,0,0-1.5-2A7,7,0,0,0,40,22a5,5,0,0,0-1.57-.4,6.68,6.68,0,0,0-2,.21,1.72,1.72,0,0,0,0,.9,10.73,10.73,0,0,1,4.22,2.47A10.2,10.2,0,0,1,42.1,27.12Z"/>
<path fill="currentColor" d="M50.93,24.36l-.31-1a11.39,11.39,0,0,0-.56-1.22,15.32,15.32,0,0,0-2.74-3.75,13.9,13.9,0,0,0-4.15-2.89,10.24,10.24,0,0,0-1.6-.59,6.38,6.38,0,0,0-1.29-.31,13.79,13.79,0,0,0-3.85,0c-.16,0-.15.86,0,.89a17,17,0,0,1,9.22,4.6,16.9,16.9,0,0,1,3.06,4.39,15.44,15.44,0,0,1,1.51,4.86c0,.14.88.15.89,0A13.1,13.1,0,0,0,50.93,24.36Z"/>
<path fill="currentColor" d="M28.25,30.34a.76.76,0,0,1,.08-.59,1,1,0,0,0-.32.59,3.83,3.83,0,0,0,.15,1.58,9.42,9.42,0,0,0,1.13,2.65c.49.7,1.14,1.44,1.14,1.44s.64.72,1.27,1.32a7.54,7.54,0,0,0,2.6,1.4,2.57,2.57,0,0,0,1.6,0,1.53,1.53,0,0,0,.55-.39,1.57,1.57,0,0,1-.6.16A2.14,2.14,0,0,1,34.6,38a13.75,13.75,0,0,1-1.86-1.8A16.09,16.09,0,0,1,31.56,35s-.55-.63-1-1.32c-.24-.33-1.06-1.18-1.66-2.08A3.66,3.66,0,0,1,28.25,30.34Z"/>
</g>
</g>
</svg>
</a>
</div>
<div id="item-email">
<a href="mailto:mail@mail.de" title="mail@mail.de">
<svg id="symbol-email" class="symbol-fill" xmlns="http://www.w3.org/2000/svg" width="76" height="65" viewBox="31 21 75 65">
<title>E-Mail</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="currentColor" d="M35.82,44.7h-1.3a4.23,4.23,0,0,1-1.2-.4,3.53,3.53,0,0,1-1.6-1.8,2.66,2.66,0,0,1-.3-1.2,4.48,4.48,0,0,0-.1-1.1,18.48,18.48,0,0,0-.1-2.3c0-1.7-.1-3.8-.1-6.6V25.1a4.14,4.14,0,0,1,.5-1.9,4.08,4.08,0,0,1,3.6-2.1c17.1,0,16.7.1,26.2.5.4,0,.4,1.1,0,1.1-10.2.5-15,.5-26.2.5a2,2,0,0,0-1.9,1.5c-.1.3,0,1.1-.1,1.7v1.9c0,2.5,0,4.8-.1,6.9s-.1,4.2-.2,6.1a2.34,2.34,0,0,0,.8,1.8,2.62,2.62,0,0,0,.9.5.9.9,0,0,0,.5.1l.6.1c.4-.1.4.9.1.9"/>
<path fill="currentColor" d="M62.12,21.5a3.74,3.74,0,0,1,3.5,3.2,4.1,4.1,0,0,0,.1,1.1v1a18.48,18.48,0,0,0,.1,2.3c0,1.7.1,3.8.1,6.6v5.5c0,.3-.1.6-.1,1a4.25,4.25,0,0,1-1,1.7A4.18,4.18,0,0,1,63,45a4.25,4.25,0,0,1-1.1.2H43.72c-1.7,0-3-.1-4.3-.2a14.92,14.92,0,0,1-2.1-.2c-.4,0-.8-.1-1.2-.1a3.9,3.9,0,0,1-1.4-.2c-.4-.1-.1-1.1.2-1.1a8.08,8.08,0,0,0,1.5-.1c.5,0,1.1-.1,1.6-.1,1,0,2-.1,3-.1,2-.1,3.9-.1,6-.2,4.1-.1,8.4-.1,14.1-.1H62a1.42,1.42,0,0,0,.6-.2,2,2,0,0,0,.9-.9,1.42,1.42,0,0,0,.2-.6V38.4c0-2.5,0-4.8.1-6.9s.1-4.2.2-6.1V24.2a2.39,2.39,0,0,0-.3-.9,2.49,2.49,0,0,0-1.6-1.1c-.4.3-.5-.7,0-.7"/>
<path fill="currentColor" d="M60.22,27.4c-1.3,1.3-2,2.1-3.4,3.5-.7.7-1.6,1.5-2.8,2.6q-.9.75-2.1,1.8c-1,.8-2.1,1.8-3.3,2.9l-.1.1c-2.3-2-3.9-3.4-5-4.4a21.52,21.52,0,0,1-2.1-2c-1.1-1-1.8-1.9-4.3-4.6-.1-.1.4-.7.5-.6,2.2,1.7,4,2.9,5.7,4.3.9.7,1.8,1.4,2.7,2.2.7.6,1.6,1.3,2.5,2.2,1-.8,1.9-1.6,2.8-2.3,1.1-.9,2.1-1.7,3.1-2.5,2-1.5,3.7-2.8,5.2-3.8.2-.1.7.5.6.6"/>
</g>
</g>
</svg>
</a>
</div>
<div id="item-standort">
<a href="#" title="Google Maps" target="_blank">
<svg id="symbol-standort" class="symbol-fill" xmlns="http://www.w3.org/2000/svg" width="76" height="65" viewBox="36 13 75 65">
<title>Location</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="currentColor" d="M50.24,21.08a7.24,7.24,0,0,1,2.79.46,5.45,5.45,0,0,1,2.44,2,6.25,6.25,0,0,1,.93,4.88,6.32,6.32,0,0,1-1.86,3.25A7,7,0,0,1,50,33.4a6.63,6.63,0,0,1-4.29-1.63,6.87,6.87,0,0,1-1.86-2.67,6.62,6.62,0,0,1-.12-4,6.74,6.74,0,0,1,1.63-2.56,10.92,10.92,0,0,1,1.74-1.16A5.09,5.09,0,0,1,49.89,21c.23,0,.23.47,0,.47a4.54,4.54,0,0,0-3.25,1.86,4.86,4.86,0,0,0-.93,3,4.3,4.3,0,0,0,1.16,2.79A4.18,4.18,0,0,0,50,30.49a4.47,4.47,0,0,0,3.37-1.63,4.21,4.21,0,0,0,1.05-3.25,4.94,4.94,0,0,0-4.18-4.3c-.24.23-.24-.23,0-.23"/>
<path fill="currentColor" d="M50.59,13A14.72,14.72,0,0,1,58,15a13.65,13.65,0,0,1,5.46,6.16,15.12,15.12,0,0,1,1.28,5.46,23.81,23.81,0,0,1-1,7.08,26,26,0,0,1-4.3,8,28.94,28.94,0,0,1-3.61,4.07c-.69.7-1.39,1.28-2.2,2a5.19,5.19,0,0,1-1.28.93l-.7.47a2.32,2.32,0,0,1-1.51.46,2.35,2.35,0,0,1-1.39-.46,23.76,23.76,0,0,1-2.56-2c-.7-.58-1.39-1.28-2.09-1.86a40.83,40.83,0,0,1-3.25-3.71A28.75,28.75,0,0,1,37,35a20.55,20.55,0,0,1-1.51-9.41,13.51,13.51,0,0,1,2.91-7.2,12.43,12.43,0,0,1,4.06-3.61,14.37,14.37,0,0,1,7.21-2c.69,0,.69.46,0,.46a12.9,12.9,0,0,0-9.76,5.35,13.18,13.18,0,0,0-2.33,9.41,22.63,22.63,0,0,0,3.72,9.76A43.27,43.27,0,0,0,45,42.46a22,22,0,0,0,2.32,2.21c.47.35.82.69,1.28,1a9.91,9.91,0,0,0,1.39.93l.12-.11.7-.47a12.94,12.94,0,0,0,1.39-1.16c.93-.81,1.75-1.51,2.56-2.32A33.16,33.16,0,0,0,59,37.46a21,21,0,0,0,3.6-11.15A12.82,12.82,0,0,0,58.72,17a12.58,12.58,0,0,0-8.25-3.72c-.58.12-.58-.34.12-.34"/>
</g>
</g>
</svg>
</a>
</div>
<div id="item-socialmedia">
<svg id="symbol-socialmedia" class="symbol-fill" xmlns="http://www.w3.org/2000/svg" width="42" height="36" viewBox="19 17 42 37">
<title>Social Media</title>
<g id="Ebene_2" data-name="Ebene 2">
<g id="symbol-pfote">
<path fill="currentColor" d="M59.28,24.59a14.82,14.82,0,0,0-2.59-4.36,12.16,12.16,0,0,0-2-1.65,8.37,8.37,0,0,0-2.36-1.06,9.71,9.71,0,0,0-5.19-.36,16,16,0,0,0-7.54,4.48l-.36-.35a10.81,10.81,0,0,0-1.77-1.53c-.58-.47-1.29-.83-1.88-1.3a6.84,6.84,0,0,0-2.12-.94A8.33,8.33,0,0,0,31.1,17a10.22,10.22,0,0,0-4.6.59,11.81,11.81,0,0,0-3.89,2.6A16,16,0,0,0,20.13,24a8.44,8.44,0,0,0-.59,4.48c.35,3.07,2.24,5.66,4.25,7.79.35.35.7.59.94.82-.12.12-.24.24-.24.36a7.39,7.39,0,0,0-.59.94A2.51,2.51,0,0,0,24,40.63a3.21,3.21,0,0,0,1.18,1.3,3.1,3.1,0,0,0,2,.59,2.73,2.73,0,0,0,.36,1.88,4.35,4.35,0,0,0,1.3,1.3,2.84,2.84,0,0,0,1.65.59h.35a2.93,2.93,0,0,0,.59,2,3.24,3.24,0,0,0,1.42,1.17,3.11,3.11,0,0,0,1.76.36h.12v.23a4.08,4.08,0,0,0,.59,1.42,8,8,0,0,0,1.06.94,3.35,3.35,0,0,0,1.54.47,4.76,4.76,0,0,0,3.77-2.24,7.59,7.59,0,0,0,.94-1.18l.24-.23h0v-.12H43a3.45,3.45,0,0,0,.94.47,2.36,2.36,0,0,0,2.48-.23,3.06,3.06,0,0,0,1.29-1.89,4.78,4.78,0,0,0,.12-1.3c.12,0,.24.12.36.12a1.87,1.87,0,0,0,1.53-.35,3.22,3.22,0,0,0,1.65-2.24c.12-.36.24-1.07.12-1.07v-.35c.12,0,.23.12.35.12h.59a1.91,1.91,0,0,0,1.06-.35,1.7,1.7,0,0,0,.83-.71,2.69,2.69,0,0,0,.59-1,3.34,3.34,0,0,0,0-2.12c-.12-.35-.24-.59-.36-.94,0-.12-.11-.12-.11-.24l.35-.35a5.9,5.9,0,0,0,.83-.83A12.08,12.08,0,0,0,57.16,34a13.37,13.37,0,0,0,2-4.6A5.74,5.74,0,0,0,59.28,24.59ZM30.62,44.4c-.35,0-1.53-.82-1.17-1.53a2.24,2.24,0,0,1,.47-.71,5.74,5.74,0,0,0,.82-.94c.47-.59.83-.94,1.18-1.42.12-.11.12-.23.24-.23l.12-.12h.11a1.46,1.46,0,0,1,.71.12,3.63,3.63,0,0,1,1.18.59,1.1,1.1,0,0,1,.59,1.06l.12.12a.42.42,0,0,0-.24.12,3.64,3.64,0,0,0-.71.59,7.53,7.53,0,0,0-.94,1.06l-.12.11a3,3,0,0,1-1.18.83A2.21,2.21,0,0,1,30.62,44.4Zm3.78,3.42a1.54,1.54,0,0,1-.83-.35c-.35-.35-.59-.71-.47-1.06s.24-.47.36-.71a1.78,1.78,0,0,0,.35-.47c.12-.12.23-.35.35-.47.47-.59.83-1.06,1.18-1.42.12-.12.24-.35.47-.47l.12-.12a1.48,1.48,0,0,1,.71.12,4.42,4.42,0,0,1,1.3.59,1.25,1.25,0,0,1,.59,1.06l-.12.12-.71.71a6,6,0,0,0-.82.94l-.12.12c-.12.12-.24.23-.36.23s-.23.24-.35.24-.35.24-.47.35A1.63,1.63,0,0,1,34.4,47.82Zm6.48.83a16.41,16.41,0,0,0-1.29,1.41,2.21,2.21,0,0,1-1.54.83c-.59,0-1.41-.83-1.29-1.18A.89.89,0,0,1,37,49c.12-.11.12-.23.24-.35s.35-.35.47-.47c.47-.59.94-1.06,1.3-1.54.12-.23.35-.35.47-.59l.12-.11h0c.12-.12.59,0,.82,0a4.82,4.82,0,0,1,.83.35,2.49,2.49,0,0,1,.94.94A11.94,11.94,0,0,1,40.88,48.65ZM53.74,40a1.26,1.26,0,0,1-.71.83.93.93,0,0,1-.59.11h-.71l-.35-.11h-.12c0-.12,0-.24-.12-.24a3.27,3.27,0,0,1-.59-.35A2,2,0,0,1,50,39.8l-1.42-1.06-2.71-2.12a4.24,4.24,0,0,1-.59-.47h0l.47.71L48,39.57,49,41a3.13,3.13,0,0,0,.59.71l.59.59v.12a1.69,1.69,0,0,1-.12,1.18,2.21,2.21,0,0,1-.94,1.3,1.29,1.29,0,0,1-1.42-.12,8.22,8.22,0,0,1-1.53-1.42c-5.19-5.3-6.13-4.48-1.06.95l.83.82a2.53,2.53,0,0,0,1.06.83,3.14,3.14,0,0,1-.47,1.65c-.36.47-.71.71-.95.71a1.24,1.24,0,0,1-.82-.24c-.12-.12-.36-.24-.48-.35L43,46.41l-.12.12c0-.12-.12-.24-.24-.36A5.5,5.5,0,0,0,41.47,45a3,3,0,0,0-1.88-.59h-.36a2.78,2.78,0,0,0-.82-1.88,4.22,4.22,0,0,0-2.6-1.3H35.7a2.48,2.48,0,0,0-.83-2.12,3.89,3.89,0,0,0-2.48-1.3,1.93,1.93,0,0,0-1.06.24c-.12.11-.35.23-.47.35l-.24.24a5,5,0,0,0-.7.82c-.24.12-.36.35-.59.47a2.39,2.39,0,0,1-1.06.71c-.36.12-.71.35-1.07.24s-1.41-.83-1.06-1.54a2.44,2.44,0,0,1,.48-.7,6.31,6.31,0,0,0,.82-1,12.25,12.25,0,0,0,1.18-1.41c.47-.47.24-.36.47-.47a1.6,1.6,0,0,1,.71.11A4,4,0,0,1,31,36.5a1.11,1.11,0,0,1,.59,1.06c0,.12.71.24.82,0a2.47,2.47,0,0,0-.82-2.24A3.84,3.84,0,0,0,29.09,34a3.89,3.89,0,0,0-1.06.11c-.12.12-.35.24-.47.36l-.24.23a8.19,8.19,0,0,0-.94,1.07,3.82,3.82,0,0,1-.94.94,3.89,3.89,0,0,0-.71-.94,13.16,13.16,0,0,1-3.66-7.32c-.23-2.71,1.18-5.19,3.07-7.19a8.89,8.89,0,0,1,7.19-2.24c2.6.35,4.84,2,6.72,3.89l.36.35-2.24,2.13L34.63,27a3.47,3.47,0,0,0-.7,1.3,5.79,5.79,0,0,0-.24,1.41,2.84,2.84,0,0,0,.59,1.65,2.45,2.45,0,0,0,1.3.95,6.6,6.6,0,0,0,2.47.47,5.25,5.25,0,0,0,2.6-.59,8.85,8.85,0,0,0,1.06-.71,5,5,0,0,0,.83-.71c1.17-1.18,1.65-1.76,1.76-2.24l9.09,9.2a.11.11,0,0,1,.11.12c.12.12.24.35.36.47a2.21,2.21,0,0,1,.23.59C53.86,39.33,53.86,39.8,53.74,40ZM58,29.43a10.61,10.61,0,0,1-1.65,4l-1.41,1.77c-.24.23-.36.47-.59.59l-9.79-8c-.35-.24-.59-.24-.71-.12h0c-.7-.59-1.77.23-3.06,1.53-1.06,1.06-1.65,1.53-2.83,1.42a6.82,6.82,0,0,1-1.65-.24c-.48-.24-.48-.35-.48-.59a1.27,1.27,0,0,1,.12-.59c0-.12.12-.23.12-.35v-.12h0c-1.18-.83-.24-.24-.59-.35l.59.35h0l.12-.12a17.74,17.74,0,0,0,1.41-1.53l3-2.95h0a14.73,14.73,0,0,1,7.19-4.83,8.1,8.1,0,0,1,4.13.23,8.82,8.82,0,0,1,3.66,2.12A9.38,9.38,0,0,1,58,29.43Z"/>
</g>
</g>
</svg>
</div>
</div>
</div>
</body>- Is it possible to pull css values with HTA javascript?
- What a strange syntax?
- JavaScript / Jest: How to show logs from test case only when test fails?
- How to secure my login page
- How can I create a two-way mapping in JavaScript, or some other way to swap out values?
- Route "/[locale]" used `params.locale`. `params` should be awaited before using its properties
- Page.locator() is the recommended way to select and interact with elements. Why does it offer less functionalities than Page.$()?
- How to filter object array based on attributes?
- How do you convert from emoji to unicode escapes in JS
- How to simulate a mouse click?
- Is it possible to add a single item to a vis.js timeline?
- How to ensure order of Cypress request execution
- Jquery Ajax Problem
- Can I run a function after navigating to a new page and waiting for that page to finish loading?
- Cannot start cocos after adding a new file
- Active link with React-Router?
- Is there a way to schedule offline notifications in a pwa?
- How to get the grid coordinates of an element using JavaScript?
- Bootstrap popper.js Failed to find a valid digest in the 'integrity' attribute for resource
- LeafLet map doesnt render properly on modal
- Create object from array
- How to ignore lines of code from coverage in vitest?
- How to manage CORS in Django
- How can I get an element's Accessible Name in javascript in the browser?
- TypeError: fs.readFileSync is not a function in Next.js
- Show hide divs on click in HTML and CSS without jQuery
- If an IIFE contains just one variable declaration that is immediately exported to global scope, why bother with it?
- Need explanation on following type of Javascript code
- What does an array literal with the `for` keyword inside mean in JavaScript?
- How to call a function every minute in a React component?