.graph-wrapper{margin:60px 0 0;max-width:400px;position:relative}.graph-image,.graph-wrapper>svg{display:block;width:100%}.graph-wrapper>svg{height:auto}.hotspot{border-radius:50%;cursor:pointer;height:30px;position:absolute;transform:translate(-50%,-50%);width:30px}.hotspot-1{left:16.5%;top:2.5%}.hotspot-2{left:2.5%;top:42%}.hotspot-3{left:16%;top:82%}.hotspot-4{left:50%;top:97%}.hotspot-5{left:83.7%;top:82%}.hotspot-6{left:97.5%;top:42%}.hotspot-7{left:83%;top:2.5%}.tooltip{background:#fff;border:1px solid #cdcdcd;border-radius:0;bottom:40px;box-shadow:0 8px 30px rgba(0,0,0,.15);opacity:0;padding:16px;transform:translateX(-50%) translateY(10px);transition:all .3s ease;visibility:hidden;width:220px;z-index:5}.tooltip,.tooltip:after{left:50%;position:absolute}.tooltip:after{border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid #cdcdcd;bottom:-10px;content:"";transform:translateX(-50%)}.tooltip h4{color:#222;font-family:var(--body-text-family);font-size:16px;font-weight:400;margin:0;text-align:center}.tooltip p{color:#666;font-size:13px;line-height:1.5;margin:0}.hotspot:hover .tooltip{opacity:1;transform:translateX(-50%) translateY(0);visibility:visible}@media (max-width:767px){.hotspot{height:34px;width:34px}.tooltip{bottom:45px;padding:12px;width:180px}.tooltip h4{font-size:14px}.tooltip p{font-size:12px}}.hotspot-1 .tooltip,.hotspot-2 .tooltip,.hotspot-3 .tooltip{left:0;transform:translateY(10px)}.hotspot-1:hover .tooltip,.hotspot-2:hover .tooltip,.hotspot-3:hover .tooltip{transform:translateY(0)}.hotspot-1 .tooltip:after,.hotspot-2 .tooltip:after,.hotspot-3 .tooltip:after{left:18px;transform:none}.hotspot-5 .tooltip,.hotspot-6 .tooltip,.hotspot-7 .tooltip{left:auto;right:0;transform:translateY(10px)}.hotspot-5:hover .tooltip,.hotspot-6:hover .tooltip,.hotspot-7:hover .tooltip{transform:translateY(0)}.hotspot-5 .tooltip:after,.hotspot-6 .tooltip:after,.hotspot-7 .tooltip:after{left:auto;right:18px;transform:none}.hotspot-4 .tooltip{left:50%;transform:translateX(-50%) translateY(10px)}.hotspot-4:hover .tooltip{transform:translateX(-50%) translateY(0)}