@font-face{font-family:Gloria Hallelujah;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/gloriahallelujah/v21/LYjYdHv3kUk9BMV96EIswT9DIbW-MIS11zY.ttf)format("truetype")}@font-face{font-family:Lato;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/lato/v24/S6uyw4BMUTPHjx4wWw.ttf)format("truetype")}html,body{color:#333;background-color:#dbe2ef;width:100vw;height:100vh;margin:0;padding:0;font-family:Lato,sans-serif;overflow-x:hidden}.wrapper{animation:14s ease-in-out .1s infinite position_wrapper;position:absolute;top:50%;left:0;transform:translateY(-50%)}.cry{opacity:0;font-family:Gloria Hallelujah,cursive;font-size:30px;animation:7s 3s infinite move_cry;position:absolute;top:20%;left:50%;transform:translate(-50%)}.freeze:after{content:"Fange den Dino um zu starten";color:#718dc0;text-transform:uppercase;cursor:pointer;border:3px solid #94a9d0;padding:5px 10px;font-size:20px;font-weight:400;position:absolute;top:20px;left:20px}.freeze:hover .cry,.freeze:hover .wrapper,.freeze:hover .wrapper .head,.freeze:hover .wrapper .hand,.freeze:hover .wrapper .hand .elbow,.freeze:hover .wrapper .hand#second-hand,.freeze:hover .wrapper .leg,.freeze:hover .wrapper .leg .knee,.freeze:hover .wrapper .leg .knee .foreleg,.freeze:hover .wrapper .leg#second-leg,.freeze:hover .wrapper .leg#second-leg .knee,.freeze:hover .wrapper .leg#second-leg .knee .foreleg,.freeze:hover .wrapper ul.tail{animation-play-state:paused}.dinosaur{width:320px;height:440px;position:relative}.dinosaur .body{background-color:#68c3a4;border-radius:30px;width:85px;height:180px;position:absolute;top:200px;left:120px;transform:rotate(5deg)}.dinosaur .body .body-mask{z-index:4;background-color:#68c3a4;border-radius:30px;width:85px;height:180px;position:absolute;top:0;left:0;transform:rotate(5deg)}.dinosaur .body .body-mask:after{content:"";background-color:#68c3a4;border-radius:50%;width:80px;height:100px;position:absolute;top:45px;right:-30px}.dinosaur .body .body-mask ul{width:0;height:0;list-style:none;position:absolute;top:10px;left:-52px;transform:rotate(-5deg)}.dinosaur .body .body-mask ul li{background-color:#68c3a4;border-radius:2px;width:15px;height:15px;margin:5px 0 0;display:inline-block;transform:rotate(45deg)}.dinosaur .body .mark{z-index:4;background-color:#47b18d;border-radius:60% 60% 25px 10px;width:30px;height:40px;position:absolute;top:30px;left:10px}.dinosaur .body .mark:after{content:"";background-color:#47b18d;border-radius:25px 10px 60% 60%;width:30px;height:40px;position:absolute;bottom:-50px;left:0}.dinosaur .body .head{z-index:4;transform-origin:0 0;background-color:#68c3a4;border-radius:0 30px 30% 20%;width:160px;height:220px;position:absolute;top:50px;left:22px;transform:rotate(-120deg)}.dinosaur .body .head:before{content:"";background-color:#388d70;border-radius:200% 15px 0 40px;width:70px;height:120px;position:absolute;bottom:0;left:18px;transform:rotate(-10deg)}.dinosaur .body .head ul{width:0;height:140px;list-style:none;position:absolute;bottom:-44px;left:44px;transform:rotate(-10deg)}.dinosaur .body .head ul li{background-color:#68c3a4;border-radius:2px;width:20px;height:20px;margin:5px 0 0;display:inline-block;transform:rotate(45deg)}.dinosaur .body .head .head-mask{background-color:#dbe2ef;border-radius:200% 15px 0 40px;width:70px;height:120px;position:absolute;bottom:-10px;left:20px;transform:rotate(-10deg)}.dinosaur .body .head .head-mask:before{content:"";background-color:#dbe2ef;width:60px;height:40px;position:absolute;bottom:20px;left:-45px;transform:rotate(45deg)}.dinosaur .body .head .head-mask:after{content:"";background-color:#68c3a4;border-radius:0 25px 5px 30px;width:38px;height:10px;position:absolute;bottom:54px;left:-26px;transform:rotate(45deg)}.dinosaur .body .head .eye{background-color:#f5f5f5;border-radius:50%;width:45px;height:55px;animation:6s infinite blink_eye;position:absolute;top:65px;right:15px;overflow:hidden;transform:rotate(-30deg)}.dinosaur .body .head .eye:after{content:"";background-color:#333;border-radius:50%;width:10px;height:10px;position:absolute;bottom:15px;left:10px}.dinosaur .body .hand{z-index:5;transform-origin:100% 0;background-color:#68c3a4;border-radius:30px;width:40px;height:60px;position:absolute;top:0;right:5px;transform:rotate(-30deg)}.dinosaur .body .hand .elbow{transform-origin:0 0;background-color:#68c3a4;border-top-left-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;width:30px;height:50px;position:absolute;top:60px;right:-5px;transform:rotate(-90deg)}.dinosaur .body .hand .elbow .forearm{transform-origin:0 100%;background-color:#68c3a4;border-top-left-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;width:20px;height:45px;position:absolute;bottom:0;right:-20px;transform:rotate(-100deg)}.dinosaur .body .hand .elbow .forearm:after{content:"";background-color:#dbe2ef;border-radius:50%;width:15px;height:15px;position:absolute;top:3px;right:-8px}.dinosaur .body .hand#second-hand{z-index:2;background-color:#388d70;width:20px;height:50px;top:5px;right:15px;transform:rotate(-50deg)}.dinosaur .body .hand#second-hand .elbow{background-color:#388d70;width:30px;height:50px}.dinosaur .body .hand#second-hand .elbow .forearm{background-color:#388d70;width:20px;height:45px}.dinosaur .body .leg{z-index:5;transform-origin:100%;background-color:#68c3a4;border-radius:15px;width:80px;height:40px;position:absolute;bottom:5px;right:50px;transform:rotate(200deg)}.dinosaur .body .leg .knee{transform-origin:0;background-color:#68c3a4;border-top-left-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;width:60px;height:30px;position:absolute;top:10px;left:15px;transform:rotate(-90deg)}.dinosaur .body .leg .knee .foreleg{transform-origin:0;background-color:#68c3a4;border-top-left-radius:60%;width:20px;height:40px;position:absolute;bottom:0;right:0;transform:rotate(-50deg)}.dinosaur .body .leg .knee .foreleg:after{content:"";background-color:#dbe2ef;border-top-left-radius:60%;width:20px;height:40px;position:absolute;bottom:-2px;right:-8px}.dinosaur .body .leg#second-leg{z-index:2;background-color:#388d70;width:60px;height:40px;bottom:0;right:60px;transform:rotate(200deg)}.dinosaur .body .leg#second-leg .knee,.dinosaur .body .leg#second-leg .knee .foreleg{background-color:#388d70}.dinosaur .body ul.tail{transform-origin:0;width:100px;height:60px;list-style:none;position:absolute;bottom:-10px;left:20px;transform:rotate(-200deg)}.dinosaur .body ul.tail li{background-color:#68c3a4;position:absolute}.dinosaur .body ul.tail li:after{content:"";background-color:#68c3a4;width:25px;height:20px;position:absolute;top:-10px;left:0;transform:skew(12deg)rotate(12deg)}.dinosaur .body ul.tail li:before{content:"";background-color:#68c3a4;width:25px;height:20px;position:absolute;bottom:-10px;left:0;transform:skew(-12deg)rotate(-12deg)}.dinosaur .body ul.tail li:first-child{width:25px;height:50px;bottom:0;left:0}.dinosaur .body ul.tail li:nth-child(2){width:25px;height:40px;bottom:5px;left:25px}.dinosaur .body ul.tail li:nth-child(3){width:25px;height:30px;bottom:10px;left:50px}.dinosaur .body ul.tail li:nth-child(4){width:25px;height:20px;bottom:15px;left:75px}.dinosaur .body ul.tail li:nth-child(5){width:25px;height:10px;bottom:20px;left:100px}.dinosaur .body ul.tail li:nth-child(6){background-color:#0000;border:12px solid #0000;border-left:45px solid #68c3a4;border-right-width:0;width:0;height:0;bottom:13px;left:125px}.dinosaur .body ul.tail li:nth-child(6):after,.dinosaur .body ul.tail li:nth-child(6):before{content:none}.dinosaur.run .body{transform:rotate(25deg)}.dinosaur.run .head{animation:4s infinite move_head}.dinosaur.run .hand{animation:2s infinite run_hand}.dinosaur.run .hand#second-hand{animation:2s .5s infinite run_hand-second}.dinosaur.run .hand .elbow{animation:2s infinite run_elbow}.dinosaur.run .leg{animation:.6s infinite run_leg}.dinosaur.run .leg .knee{animation:.6s infinite run_knee}.dinosaur.run .leg .knee .foreleg{animation:.6s infinite run_foreleg}.dinosaur.run .leg#second-leg{animation:.6s .3s infinite run_leg-second;bottom:0}.dinosaur.run .leg#second-leg .knee{animation:.6s .3s infinite run_knee-second}.dinosaur.run .leg#second-leg .knee .foreleg{animation:.6s .3s infinite run_foreleg-second}.dinosaur.run ul.tail{animation:.6s infinite move_tail}@keyframes run_hand{0%{transform:rotate(-30deg)}50%{transform:rotate(-25deg)}to{transform:rotate(-30deg)}}@keyframes run_elbow{0%{transform:rotate(-90deg)}50%{transform:rotate(-75deg)}to{transform:rotate(-90deg)}}@keyframes run_hand-second{0%{transform:rotate(-50deg)}50%{transform:rotate(-45deg)}to{transform:rotate(-50deg)}}@keyframes run_leg{0%{transform:rotate(200deg)}50%{transform:rotate(170deg)}to{transform:rotate(200deg)}}@keyframes run_knee{0%{transform:rotate(-90deg)}50%{transform:rotate(-110deg)}to{transform:rotate(-90deg)}}@keyframes run_foreleg{0%{transform:rotate(-50deg)}50%{transform:rotate(-10deg)}to{transform:rotate(-50deg)}}@keyframes run_leg-second{0%{transform:rotate(200deg)}50%{transform:rotate(170deg)}to{transform:rotate(200deg)}}@keyframes run_knee-second{0%{transform:rotate(-90deg)}50%{transform:rotate(-110deg)}to{transform:rotate(-90deg)}}@keyframes run_foreleg-second{0%{transform:rotate(-50deg)}50%{transform:rotate(-10deg)}to{transform:rotate(-50deg)}}@keyframes move_tail{0%{transform:rotate(-200deg)}50%{transform:rotate(-210deg)}to{transform:rotate(-200deg)}}@keyframes move_head{0%{transform:rotate(-125deg)}50%{transform:rotate(-110deg)}to{transform:rotate(-125deg)}}@keyframes blink_eye{0%{transform:rotate(-30deg)scaleX(1)}1%{transform:rotate(-30deg)scaleX(0)}3%{transform:rotate(-30deg)scaleX(1)}}@keyframes move_cry{0%{opacity:0;transform:rotate(0)}5%{opacity:1;transform:translateY(-50px)rotate(-5deg)scale(1.2)}20%{opacity:0;transform:rotate(0)}}@keyframes position_wrapper{0%{transform:translateY(-50%)translate(-400px)}50%{transform:translateY(-50%)translate(calc(100vw + 100px))}51%{transform:translateY(-50%)translate(calc(100vw + 100px))scaleX(-1)}to{transform:translateY(-50%)translate(-400px)scaleX(-1)}}