*{margin:0;padding:0}html,body{height:100%;font-family:monospace,sans-serif}.screen{height:100%;width:100%;margin:0 auto;position:relative}.wrap{height:100%;width:100%;position:absolute;top:0}.container{height:100%;width:100%;position:relative;overflow:hidden}.container *{position:absolute}p{font-size:60px;font-weight:700;color:#509b35;cursor:default}#container1{background-color:#fffaf1}#container1 .div1{height:200%;width:100%;background:url("data:image/svg+xml,%3csvg%20width='600'%20height='600'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%3e%3cdefs%3e%3cfilter%20id='Gaussian_Blur'%3e%3cfeGaussianBlur%20in='SourceGraphic'%20stdDeviation='4'%20/%3e%3c/filter%3e%3c/defs%3e%3ccircle%20cx='150'%20cy='120'%20r='30'%20fill='rgba(80,%20155,%2053,%200.4)'%20style='filter:url(%23Gaussian_Blur)'/%3e%3ccircle%20cx='450'%20cy='225'%20r='33'%20fill='rgba(80,%20155,%2053,%200.4)'%20style='filter:url(%23Gaussian_Blur)'/%3e%3ccircle%20cx='270'%20cy='450'%20r='26'%20fill='rgba(80,%20155,%2053,%200.4)'%20style='filter:url(%23Gaussian_Blur)'/%3e%3c/svg%3e") 0 0 repeat}#container1 .div2{height:200%;width:100%;background:url("data:image/svg+xml,%3csvg%20width='500'%20height='500'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%3e%3cdefs%3e%3cfilter%20id='Gaussian_Blur'%3e%3cfeGaussianBlur%20in='SourceGraphic'%20stdDeviation='1'%20/%3e%3c/filter%3e%3c/defs%3e%3ccircle%20cx='220'%20cy='60'%20r='41'%20fill='rgba(80,%20155,%2053,%200.6)'%20style='filter:url(%23Gaussian_Blur)'/%3e%3ccircle%20cx='70'%20cy='320'%20r='39'%20fill='rgba(80,%20155,%2053,%200.6)'%20style='filter:url(%23Gaussian_Blur)'/%3e%3c/svg%3e") 0 0 repeat;z-index:1}#container1 .div3{height:200%;width:100%;background:url("data:image/svg+xml,%3csvg%20width='700'%20height='700'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%3e%3ccircle%20cx='180'%20cy='220'%20r='50'%20fill='rgba(80,%20155,%2053,%200.9)'/%3e%3ccircle%20cx='320'%20cy='520'%20r='54'%20fill='rgba(80,%20155,%2053,%200.9)'/%3e%3ccircle%20cx='600'%20cy='80'%20r='46'%20fill='rgba(80,%20155,%2053,%200.9)'/%3e%3c/svg%3e") 0 0 repeat;z-index:1}#container1 p{top:40%;font-size:80px;width:100%;text-align:center}#container3{background-color:#fffaf1}#container3 svg{fill:none;stroke:#666;stroke-width:2;width:40%;position:absolute;left:50%;transform:translate(-50%);margin-top:100px}#container3 p{position:static}#container3 .text-wrapper{width:100%;height:80px;overflow:hidden;position:absolute;bottom:100px;text-align:center}#container3 .shadow{height:100%;width:100%;position:absolute;top:0;left:0;background:linear-gradient(90deg,transparent,#fffaf1 10%,#fffaf1)}#container2{background-color:#fffaf1}#container2 .battery{width:300px;height:150px;background-color:transparent;border-radius:20px;border:solid 5px #666;padding:20px;left:50%;top:50%;box-sizing:border-box;transform:translate(-50%) translateY(-80%)}#container2 .battery:after{content:" ";width:13px;height:50px;border-radius:4px;position:absolute;right:-13px;top:45px;background-color:#666}#container2 .div1{height:100px;width:125px;border-radius:10px;background-color:#fd0}#container2 p{text-align:center;width:100%;color:#209b35;bottom:100px;left:50%;transform:translate(-50%)}#container4{perspective:150px;background-color:#fffaf1}#container4 .showcase{transform-style:preserve-3d;width:100%;height:100%;position:relative}#container4 p{font:700 60px/150px monospace;height:150px;width:100%;text-align:center;top:50%;margin-top:-75px;background-color:transparent;backface-visibility:hidden}#container4 p:nth-child(1){transform:rotateX(0) translateZ(100px)}#container4 p:nth-child(2){transform:rotateX(-40deg) translateZ(100px)}#container4 p:nth-child(3){transform:rotateX(-80deg) translateZ(100px)}#container4 p:nth-child(4){transform:rotateX(-120deg) translateZ(100px)}#container4 p:nth-child(5){transform:rotateX(-160deg) translateZ(100px)}#container4 p:nth-child(6){transform:rotateX(-200deg) translateZ(100px)}#container4 p:nth-child(7){transform:rotateX(-240deg) translateZ(100px)}#container4 p:nth-child(8){transform:rotateX(-280deg) translateZ(100px)}#container4 p:nth-child(9){transform:rotateX(-320deg) translateZ(100px)}
