:root{--hotspot-content-background-color: #fff;--hotspot-content-text-color: #000;--hotspot-content-h-padding: 10px;--hotspot-content-v-padding: 8px;--hotspot-content-max-width: 250px;--hotspot-content-border-radius: 4px;--hotspot-content-arrow-size: 10px;--hotspot-content-shadow: 0 0 5px rgba(0, 0, 0, 0.5);--hotspot-content-z-index: 10;--hotspot-svg-fill: #fff;--hotspot-svg-size: 32px;--hotspot-animation-name: hotspot-pulse;--hotspot-animation-duration: 2s;--hotspot-animation-pulse-scale: 1.1;--hotspot-animation-pulse-color: #fff;--hotspot-hover-scale-value: 1.1;--hotspot-fade-duration: 0.3s}.image-with-hotspots{position:relative}.image-with-hotspots img{width:100%;height:auto}.hotspots{position:absolute;top:0;left:0;right:0;bottom:0;z-index:10;z-index:var(--hotspot-content-z-index)}.hotspot{position:absolute;list-style:none}.hotspot__button{display:inline-block;padding:0;background-color:rgba(0,0,0,0);position:relative;cursor:pointer}.hotspot__button svg{position:absolute;top:0;left:0;transform:translate(-50%, -50%);fill:#fff;fill:var(--hotspot-svg-fill);width:32px;width:var(--hotspot-svg-size);height:32px;height:var(--hotspot-svg-size)}.image-with-hotspots--animated .hotspot__button svg{animation-name:hotspot-pulse;animation-name:var(--hotspot-animation-name);animation-duration:2s;animation-duration:var(--hotspot-animation-duration);animation-iteration-count:infinite}.image-with-hotspots--animated .hotspot__button:has(+.hotspot__content--active) svg,.image-with-hotspots--animated .hotspot__button:hover svg{animation:none;transform:translate(-50%, -50%) scale(1.1);transform:translate(-50%, -50%) scale(var(--hotspot-animation-pulse-scale));transition:transform 2s;transition:transform var(--hotspot-animation-duration)}.image-with-hotspots--hover-scale .hotspot__button svg{transition:scale .3s ease-in-out;transform-origin:center}.image-with-hotspots--hover-scale .hotspot__button:hover svg{transform:translate(-50%, -50%) scale(1.1);transform:translate(-50%, -50%) scale(var(--hotspot-hover-scale-value))}.hotspot__content-wrap{display:none;position:absolute;top:0;left:0;z-index:10;z-index:var(--hotspot-content-z-index)}.image-with-hotspots--shadow .hotspot__content-wrap{filter:drop-shadow(0 0 5px rgba(0, 0, 0, 0.5));filter:drop-shadow(var(--hotspot-content-shadow))}.hotspot__content{background-color:#fff;background-color:var(--hotspot-content-background-color);color:#000;color:var(--hotspot-content-text-color);padding:8px 10px;padding:var(--hotspot-content-v-padding) var(--hotspot-content-h-padding);border-radius:4px;border-radius:var(--hotspot-content-border-radius);max-width:250px;max-width:var(--hotspot-content-max-width);width:-moz-max-content;width:max-content}.hotspot__arrow{position:absolute;width:10px;width:var(--hotspot-content-arrow-size);height:10px;height:var(--hotspot-content-arrow-size);background-color:#fff;background-color:var(--hotspot-content-background-color)}.hotspot__content-position--bottom .hotspot__arrow,.hotspot__content-position--bottom-start .hotspot__arrow,.hotspot__content-position--bottom-end .hotspot__arrow{top:calc(10px/-2);top:calc(var(--hotspot-content-arrow-size)/-2);transform:rotate(45deg)}.hotspot__content-position--top .hotspot__arrow,.hotspot__content-position--top-start .hotspot__arrow,.hotspot__content-position--top-end .hotspot__arrow{bottom:calc(10px/-2);bottom:calc(var(--hotspot-content-arrow-size)/-2);transform:rotate(225deg)}.hotspot__content-position--right .hotspot__arrow,.hotspot__content-position--right-start .hotspot__arrow,.hotspot__content-position--right-end .hotspot__arrow{left:calc(10px/-2);left:calc(var(--hotspot-content-arrow-size)/-2);transform:rotate(-45deg)}.hotspot__content-position--left .hotspot__arrow,.hotspot__content-position--left-start .hotspot__arrow,.hotspot__content-position--left-end .hotspot__arrow{right:calc(10px/-2);right:calc(var(--hotspot-content-arrow-size)/-2);transform:rotate(135deg)}.image-with-hotspots--fade .hotspot__content-wrap{opacity:0;transition:opacity 0.3s ease-in-out, display 0.3s allow-discrete;transition:opacity var(--hotspot-fade-duration) ease-in-out, display var(--hotspot-fade-duration) allow-discrete;transition-behavior:allow-discrete}.image-with-hotspots--fade .hotspot__content-wrap.hotspot__content--active{opacity:1;transition:opacity 0.3s ease-in-out, display 0.3s allow-discrete;transition:opacity var(--hotspot-fade-duration) ease-in-out, display var(--hotspot-fade-duration) allow-discrete;transition-behavior:allow-discrete}@keyframes hotspot-pulse{0%{filter:drop-shadow(0 0 0 #fff);filter:drop-shadow(0 0 0 var(--hotspot-animation-pulse-color));transform:translate(-50%, -50%) scale(1)}30%{transform:translate(-50%, -50%) scale(1.1);transform:translate(-50%, -50%) scale(var(--hotspot-animation-pulse-scale))}60%{filter:drop-shadow(0 0 10px #fff);filter:drop-shadow(0 0 10px var(--hotspot-animation-pulse-color))}}
/*# sourceMappingURL=hotspots.css.f315f.map */