.triangle-wrapper{position:fixed;background-color:rgba(0,0,0,0.7);width:100%;height:100%;top:0;left:0;z-index:1000;transition:opacity 500ms ease-in-out;opacity:0}.triangle-wrapper.fade{opacity:1}.triangle-ls-wrapper{position:relative;height:150px;width:150px;top:50%;left:50%;transform:translate3d(-50%, -50%, 0)}.triangle-ls{animation:grow-and-fade 2000ms linear infinite;height:150px;left:0;opacity:0;width:150px;position:absolute;top:0%;transform:translatez(0);transform-origin:50% 60%;will-change:opacity, transform}.triangle-loading{animation:pulsing-fade 1500ms ease infinite;color:white;font-family:'Helvetica Neue', Helvetica, sans-serif;font-size:12px;font-weight:300;left:50%;letter-spacing:8px;text-align:center;margin-left:4px;margin-top:10px;opacity:0;position:absolute;top:100%;transform:translate3d(-50%, -50%, 0);text-transform:uppercase}.triangle-svg{margin-top:-20px;opacity:0.5;overflow:visible}.triangle-polygon{stroke-width:5px}.triangle-1{animation-delay:0ms}.triangle-1 .triangle-polygon{stroke:hotpink}.triangle-2{animation-delay:400ms}.triangle-2 .triangle-polygon{stroke:aqua}.triangle-3{animation-delay:800ms}.triangle-3 .triangle-polygon{stroke:cornflowerblue}.triangle-4{animation-delay:1200ms}.triangle-4 .triangle-polygon{stroke:yellow}.triangle-5{animation-delay:1600ms}.triangle-5 .triangle-polygon{stroke:white}@keyframes grow-and-fade{0%{opacity:0;transform:scale(0.1) translatez(0)}40%{opacity:1}60%{opacity:1}100%{opacity:0;transform:scale(1) translatez(0)}}@keyframes pulsing-fade{0%{opacity:0}20%{opacity:0.2}40%{opacity:0.8}80%{opacity:0.2}80%{opacity:0}}