@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700,900&display=swap);#app{font-family:Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#000;margin-top:60px}body{overflow:hidden;margin:0}li{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.firstElement,h2{margin:0}h2{font-weight:400;margin-top:10px;margin-bottom:10px}.username,h2{font-size:1.5rem}.username{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:.5rem 2rem;margin-top:-3rem;background-color:#de03d6;border-radius:.75rem;-webkit-box-shadow:0 8px 12px 0 rgba(0,0,0,.1);box-shadow:0 8px 12px 0 rgba(0,0,0,.1);font-weight:500}.video{position:fixed;bottom:0;-o-object-fit:cover;object-fit:cover;z-index:-5;height:100vh;width:100vw}.show p{font-size:1.5rem}.postTime{margin-top:20px;color:#b3b3b3;float:right;font-weight:700;margin-bottom:0}.spacer{height:25px}.text-bubble{-moz-box-shadow:-1px 44px 42px -30px rgba(0,0,0,.53);-webkit-box-shadow:-1px 44px 42px -30px rgba(0,0,0,.53);background-color:rgba(102,51,203,.69);border-radius:1.5rem;-webkit-box-shadow:-1px 44px 42px -30px rgba(0,0,0,.253);box-shadow:-1px 44px 42px -30px rgba(0,0,0,.253);color:#000;list-style:none;margin-bottom:3rem;padding:2rem;color:#fff;position:relative;width:50vw}.bubbleanim{position:fixed;bottom:0;right:0;width:100%;margin-bottom:-2rem}.userleft{position:absolute;bottom:0;text-align:right;background-color:#8000ad}.userleft,.userright{color:#fff;padding:.5rem 2rem;border-radius:4rem;-webkit-box-shadow:0 15px 60px 0 rgba(0,0,0,.8);box-shadow:0 15px 60px 0 rgba(0,0,0,.8);font-weight:500}.username-bubble,.userright{text-align:left;background-color:#de03d6}.username-bubble{color:#fff;padding:.35rem 3rem;border-radius:1rem;-webkit-box-shadow:0 15px 630px 0 rgba(0,0,0,.2);box-shadow:0 15px 30px 0 rgba(0,0,0,.2);height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.user-bubble-left{background-color:#6633cb}.bubbleanim li:last-child{position:relative;bottom:0;-webkit-animation:slideUp 2s;animation:slideUp 2s}.bubbleanim li:last-child .show{-webkit-box-shadow:0 44px 82px 20px rgba(0,0,0,.64)}@-webkit-keyframes shadow{0%{-webkit-box-shadow:0 80px 82px 600px rgba(0,0,0,.64)}60%{-webkit-box-shadow:0 80px 82px 20px rgba(0,0,0,.64)}to{-webkit-box-shadow:0 44px 82px 20px rgba(0,0,0,.64)}}@keyframes shadow{0%{-webkit-box-shadow:0 80px 82px 600px rgba(0,0,0,.64)}60%{-webkit-box-shadow:0 80px 82px 20px rgba(0,0,0,.64)}to{-webkit-box-shadow:0 44px 82px 20px rgba(0,0,0,.64)}}.bubbleanim li:last-child .show h2{-webkit-animation:slideFadeIn 1s;animation:slideFadeIn 1s;-webkit-animation-duration:2s;animation-duration:2s}@-webkit-keyframes slideUp{0%{max-height:0;opacity:0;-webkit-transform:scale(1.05);transform:scale(1.05)}60%{-webkit-transform:scale(1.05);transform:scale(1.05)}to{max-height:1200px;opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes slideUp{0%{max-height:0;opacity:0;-webkit-transform:scale(1.05);transform:scale(1.05)}60%{-webkit-transform:scale(1.05);transform:scale(1.05)}to{max-height:1200px;opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes slideFadeIn{0%{opacity:0;-webkit-transform:translateY(150px);transform:translateY(150px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideFadeIn{0%{opacity:0;-webkit-transform:translateY(150px);transform:translateY(150px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.img-overlay{height:100vh;width:100vw;background-color:rgba(0,0,0,.5);position:fixed;bottom:0}.logo{position:absolute;z-index:0;top:1rem;left:0;width:20vw;opacity:1}.invisible{opacity:0!important;height:10rem}.left{background-color:rgba(222,3,215,.6);color:#fff}.spike{position:absolute;bottom:0;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;height:9rem;fill:#f0c8ff;-webkit-transform:scaleX(-1);transform:scaleX(-1)}.spike-left{left:-80px}.spike-right{right:-80px!important}.spikecolor{fill:#949494;-webkit-transform:scale(1);transform:scale(1)}.qr-code-wrapper{position:fixed;bottom:1rem;left:1rem;padding:1rem 1rem;background-color:rgba(0,0,0,.5);border-radius:1rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:15%}.qr-code{width:100%;margin:0 auto}.white{color:#fff}