.interactive-demo{max-width:1200px;position:relative;z-index:1}.interactive-demo h2{font-size:14px!important;margin-bottom:.25rem}@media (min-width:768px){.interactive-demo h2{margin-bottom:.375rem}}.interactive-demo p,.interactive-demo ul li{font-size:12px!important}.interactive-demo p{margin-bottom:0}.interactive-demo img{border-radius:15px;box-shadow:0 3px 100px rgba(0,0,0,.16)}.interactive-demo__hotspots{height:100%;position:absolute;top:0;width:100%}.hotspots{height:inherit;width:inherit}.hotspot,.hotspots{position:inherit;transition:all .15s linear}.hotspot{height:min(3vw,20px);transform:translateX(-.25em);width:min(3vw,20px);z-index:1}.hotspot:active,.hotspot:focus,.hotspot:hover{z-index:2}.hotspot__button{background-color:#42eac2;border:3px solid #fff;border-radius:50%;height:inherit;padding:0;position:inherit;width:inherit}.hotspot__button:after,.hotspot__button:before{background-color:#42eac2;border-radius:inherit;box-shadow:0 3px 27px #42eac2;content:"";height:min(8vw,45px);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transform-origin:0 0;transition:transform .25s ease-in-out;width:min(8vw,45px);z-index:-1}.hotspot__button:after{animation:pulse 2.5s ease infinite}.hotspot__button:active:before,.hotspot__button:focus:before,.hotspot__button:hover:before{transform:scale(1.25) translate(-50%,-50%);transform-origin:0 0}.hotspot__button:active:after,.hotspot__button:focus:after,.hotspot__button:hover:after{display:none}.hotspot__button:focus-visible{outline-offset:20px}.hotspot__content{background-color:#fff;border:1px solid #41eac2;border-radius:8px;box-shadow:0 3px 22px rgba(0,0,0,.16);font-size:18px;left:50%;max-width:35vw;opacity:0;overflow-wrap:anywhere;padding:.375em;pointer-events:none;position:relative;transform:translate(-50%,2.25em);transition:opacity 175ms linear;width:255px}.hotspot__content:before{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 43 30.4'%3E%3Cpath fill='%23fff' d='M42.1 36.5H.9L21.5 1z'/%3E%3Cpath fill='%2341eac2' d='M21.5 2 1.7 36h39.5zm0-2L43 37H0z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:100% 100%;bottom:100%;content:"";height:17px;left:50%;pointer-events:none;position:absolute;transform:translate(-50%,.125px);user-select:none;width:23px}@media (min-width:768px){.hotspot__content{max-width:25vw;padding:.75em}}@media (min-width:440px){.hotspot__content{max-width:25vw;transform:translate(-50%,4.25em)}.hotspot__content:before{height:37px;width:43px}}.hotspot ul{display:flex;flex-wrap:wrap;font-weight:700;margin:.375rem 0 0}.hotspot ul li+li:before{color:inherit;content:"|";display:inline-block;padding-left:.375em;padding-right:.375em}.hotspot__button:active~.hotspot__content,.hotspot__button:focus~.hotspot__content,.hotspot__button:hover~.hotspot__content{opacity:1;pointer-events:auto}@media (min-width:768px){.interactive-demo h2{font-size:18px!important}.interactive-demo p,.interactive-demo ul li{font-size:14px!important}.hotspot__button{border:4px solid #fff}}@media (min-width:992px){.hotspot__content{padding:1.5em;width:354px}.interactive-demo p,.interactive-demo ul li{font-size:16px!important}}@keyframes pulse{0%,to{display:block;opacity:0;transform:scale(1) translate(-50%,-50%)}50%{display:block;opacity:.6;transform:scale(1.3) translate(-50%,-50%)}}