@keyframes writeLine{0%{clip-path:polygon(0 0,0 100%,0 100%,0 0)}100%{clip-path:polygon(0 0,0 100%,100% 100%,100% 0)}}@keyframes keydown{0%,30%{fill-opacity:.1}15%{fill-opacity:.3}}@keyframes appOpen{0%{opacity:0;transform:scale(.3)}30%{opacity:1}100%{opacity:1;transform:scale(1)}}body,html{height:100%}.mac-wrapper{align-self:end;width:100%;max-width:500px;padding:0 20px}.mac-wrapper svg{height:auto}.mac-wrapper svg #CodeEditorWindow{display:none}.mac-wrapper.start #CodeEditorWindow{display:block;animation:.5s ease-out forwards appOpen,.5s ease-out 27s reverse forwards appOpen;transform-origin:center center}.mac-wrapper.start [id^=codeline]{clip-path:polygon(0 0,0 100%,0 100%,0 0);animation:1s linear forwards writeLine}.mac-wrapper.start #codeline1{animation-delay:1s}.mac-wrapper.start #codeline2{animation-delay:2s}.mac-wrapper.start #codeline3{animation-delay:3s}.mac-wrapper.start #codeline4{animation-delay:4s}.mac-wrapper.start #codeline5{animation-delay:5s}.mac-wrapper.start #codeline6{animation-delay:6s}.mac-wrapper.start #codeline7{animation-delay:7s}.mac-wrapper.start #codeline8{animation-delay:8s}.mac-wrapper.start #codeline9{animation-delay:9s}.mac-wrapper.start #codeline10{animation-delay:10s}.mac-wrapper.start #codeline11{animation-delay:11s}.mac-wrapper.start #codeline12{animation-delay:12s}.mac-wrapper.start #codeline13{animation-delay:13s}.mac-wrapper.start #codeline14{animation-delay:14s}.mac-wrapper.start #codeline15{animation-delay:15s}.mac-wrapper.start #codeline16{animation-delay:16s}.mac-wrapper.start #codeline17{animation-delay:17s}.mac-wrapper.start #codeline18{animation-delay:18s}.mac-wrapper.start #codeline19{animation-delay:19s}.mac-wrapper.start #codeline20{animation-delay:20s}.mac-wrapper.start #codeline21{animation-delay:21s}.mac-wrapper.start #codeline22{animation-delay:22s}.mac-wrapper.start #codeline23{animation-delay:23s}.mac-wrapper.start #codeline24{animation-delay:24s}.mac-wrapper.start #codeline25{animation-delay:25s}.mac-wrapper.start #codeline26{animation-delay:26s}.mac-wrapper.start #keyboard33{animation-name:keydown;animation-duration:1s;animation-delay:1837ms;animation-iteration-count:26}.mac-wrapper.start #keyboard29,.mac-wrapper.start #keyboard40{animation-name:keydown;animation-duration:1s;animation-delay:1.15s;animation-iteration-count:26}.mac-wrapper.start #keyboard13{animation-name:keydown;animation-duration:1s;animation-delay:1878ms;animation-iteration-count:26}.mac-wrapper.start #keyboard34{animation-name:keydown;animation-duration:1s;animation-delay:1879ms;animation-iteration-count:26}.mac-wrapper.start #keyboard35{animation-name:keydown;animation-duration:1s;animation-delay:1078ms;animation-iteration-count:26}.mac-wrapper.start #keyboard10{animation-name:keydown;animation-duration:1s;animation-delay:1742ms;animation-iteration-count:26}.mac-wrapper.start #keyboard39{animation-name:keydown;animation-duration:1s;animation-delay:1192ms;animation-iteration-count:26}.mac-wrapper.start #keyboard8{animation-name:keydown;animation-duration:1s;animation-delay:1903ms;animation-iteration-count:26}.mac-wrapper.start #keyboard25{animation-name:keydown;animation-duration:1s;animation-delay:1048ms;animation-iteration-count:26}.mac-wrapper.start #keyboard3{animation-name:keydown;animation-duration:1s;animation-delay:1266ms;animation-iteration-count:26}.mac-wrapper.start #keyboard1{animation-name:keydown;animation-duration:1s;animation-delay:1842ms;animation-iteration-count:26}.mac-wrapper.start #keyboard11{animation-name:keydown;animation-duration:1s;animation-delay:1008ms;animation-iteration-count:26}.mac-wrapper.start #keyboard2{animation-name:keydown;animation-duration:1s;animation-delay:1905ms;animation-iteration-count:26}.mac-wrapper.start #keyboard47{animation-name:keydown;animation-duration:1s;animation-delay:1737ms;animation-iteration-count:26}.mac-wrapper.start #keyboard16{animation-name:keydown;animation-duration:1s;animation-delay:1591ms;animation-iteration-count:26}.mac-wrapper.start #keyboard6{animation-name:keydown;animation-duration:1s;animation-delay:1748ms;animation-iteration-count:26}.mac-wrapper.start #keyboard-return{animation-name:keydown;animation-duration:1s;animation-delay:2s;animation-iteration-count:26}#computer-row{height:40%}#cldy-row{justify-self:end}#footer-row{height:45%}#help-card-col{max-width:400px}#cldy-logo{width:11rem}