body,html{padding:0;margin:0}body{background:#eed;font-family:sans-serif;font-size:16px;line-height:24px;color:#222538;text-align:center;-webkit-text-size-adjust:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{margin:50px 0 25px 0}h1,h2,h3{font-size:30px}h4,h5,h6{font-size:20px}p{margin:0 0 20px 0}a{color:inherit}:first-child{margin-top:0}:last-child{margin-bottom:0}.hidden{display:none!important}.btn{background:#46454d;background:-webkit-gradient(linear,left bottom,right top,from(#222538),to(#46454d));background:-webkit-linear-gradient(bottom left,#222538,#46454d);background:-o-linear-gradient(bottom left,#222538,#46454d);background:linear-gradient(to top right,#222538,#46454d);border-radius:5px;color:#eed;font-weight:700;text-decoration:none;line-height:25px;overflow:hidden;display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;padding:10px 20px;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transition:-webkit-transform .1s ease;transition:-webkit-transform .1s ease;-o-transition:transform .1s ease;transition:transform .1s ease;transition:transform .1s ease,-webkit-transform .1s ease}.btn:hover{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}.btn .font{font-size:25px}.row{margin:0 -15px}.row:after{content:'';display:block;clear:both}[class*=col]{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;width:100%;padding:0 15px;margin:30px 0 0 0;float:left}.col-11{width:91.66%}.col-10{width:83.33%}.col-9{width:75%}.col-8{width:66.66%}.col-6{width:50%}.col-4{width:33.33%}.col-3{width:25%}.col-2{width:16.66%}.col-1{width:8.33%}@media (max-width:767px){[class*=col-]{width:100%;float:none}}.font{font-family:'Indie Flower',cursive;font-size:25px;font-weight:700}.no-animation{-webkit-transition:none!important;-o-transition:none!important;transition:none!important;-webkit-transition-duration:0s!important;-o-transition-duration:0s!important;transition-duration:0s!important}.container{width:80%;min-width:300px;max-width:750px;margin:auto;position:relative}.logo{font-weight:700;text-align:left;display:block}.logo span{display:block}.logo span.small{font-weight:400;font-size:17px;margin:0 0 0 29px}.logo span.large{font-size:50px}.example li,.example ol,.example ul{display:block;list-style:none;padding:0;margin:0}.example li{height:35px;padding:7px 0}.example li+li{border-top:3px dotted rgba(34,37,56,.5);border-color:rgba(238,238,221,.2)}.example .logo{padding-top:10px}.example p{margin-bottom:0}.example p.title{opacity:.6;line-height:25px;padding-top:10px;margin-bottom:25px}.box{border:3px dotted rgba(34,37,56,.5);border-width:8px;border-radius:50px;text-align:left;font-size:20px;line-height:35px;-webkit-box-sizing:border-box;box-sizing:border-box;padding:50px;overflow:hidden}@media (max-width:500px){.box{padding:25px}}.box .example{height:240px}.box .example .toggle{font-size:15px;text-decoration:none;opacity:.6}.box .example .toggle:before{content:'[ Show more ]'}.box .example .toggle:hover{opacity:1}.box .example.full-story{height:auto}.box .example.full-story .toggle:before{content:'[ Show less ]'}.box .example:not(.full-story):not(.ddd-truncated) .toggle{cursor:default}.box .example:not(.full-story):not(.ddd-truncated) .toggle:before{content:'( Resize your browser )'}.box .example:not(.full-story):not(.ddd-truncated) .toggle:hover{opacity:.6}.box .logo{width:250px;margin:0 auto;position:relative;top:70px}.bullets a{background:rgba(34,37,56,.3);display:inline-block;width:10px;height:10px;border-radius:10px;margin-right:10px}.bullets a.current{background:#222538}.header{background:#222538;background:-webkit-gradient(linear,left bottom,right top,from(#222538),to(#46454d));background:-webkit-linear-gradient(bottom left,#222538,#46454d);background:-o-linear-gradient(bottom left,#222538,#46454d);background:linear-gradient(to top right,#222538,#46454d);color:#eed;-webkit-box-sizing:border-box;box-sizing:border-box;height:calc(100vh - 53px);min-height:350px;position:relative;overflow:hidden}.header .flip-container{width:80%;min-width:300px;max-width:750px;position:absolute;top:50%;left:50%;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0);-webkit-transition:-webkit-transform .6s ease;transition:-webkit-transform .6s ease;-o-transition:transform .6s ease;transition:transform .6s ease;transition:transform .6s ease,-webkit-transform .6s ease;-webkit-backface-visibility:hidden;backface-visibility:hidden}.header .flip-container.prev{-webkit-transform:translate3d(calc(-50vw - 100% - 50px),-50%,0);transform:translate3d(calc(-50vw - 100% - 50px),-50%,0)}.header .flip-container.next{-webkit-transform:translate3d(calc(50vw + 50px),-50%,0);transform:translate3d(calc(50vw + 50px),-50%,0)}.header .box{border-color:rgba(238,238,221,.2)}.header .bullets{width:100%;position:absolute;left:0;bottom:20px;z-index:2}.header .bullets a{background:rgba(238,238,221,.3)}.header .bullets a.current{background:#eed}pre{font-size:13px;color:#46454d}pre>span{text-align:left;display:inline-block}pre a{text-decoration:none}pre a:hover{text-decoration:underline}pre .comment{opacity:.6;-webkit-transition:opacity .5s ease;-o-transition:opacity .5s ease;transition:opacity .5s ease}pre .comment:hover{opacity:.8}nav{background:#eed;border-bottom:3px dotted rgba(34,37,56,.5);line-height:20px;padding:10px;position:-webkit-sticky;position:sticky;top:0;z-index:2;overflow-x:auto;overflow-y:hidden;white-space:nowrap}nav li,nav ul{list-style:none;padding:0;margin:0}nav ul{display:block}nav li{display:inline-block}nav a{text-decoration:none;display:block;padding:5px 15px;position:relative}nav a:hover:after{content:'';border-bottom:3px dotted rgba(34,37,56,.5);display:block;height:1px;position:absolute;bottom:-13px;left:16px;right:16px}section{padding:1px 0}section:first-of-type{margin-top:150px}section>:last-child{margin-bottom:150px}section h2,section h3{border-bottom:3px dotted rgba(34,37,56,.5);background:#eed;line-height:30px;padding:13px 0 10px 0;margin:0;position:-webkit-sticky;position:sticky;top:50px;z-index:1}section h2 a,section h3 a{color:#693;position:absolute;right:20px;top:15px;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transition:-webkit-transform .1s ease;transition:-webkit-transform .1s ease;-o-transition:transform .1s ease;transition:transform .1s ease;transition:transform .1s ease,-webkit-transform .1s ease}section h2 a:hover,section h3 a:hover{-webkit-transform:scale(1.15);-ms-transform:scale(1.15);transform:scale(1.15)}section h2+p,section h3+p{margin-top:50px}.flip-container{-webkit-perspective:2000px;perspective:2000px;-webkit-transform:rotateX(0);transform:rotateX(0)}.flip-container.flipped .flipper{-webkit-transform:rotateX(180deg);transform:rotateX(180deg)}.flip-container,.flip-container .back,.flip-container .front{width:100%;height:346px}.flip-container .flipper{-webkit-transition:-webkit-transform .3s ease-out;transition:-webkit-transform .3s ease-out;-o-transition:transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out,-webkit-transform .3s ease-out;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform-origin:100% 173px;-ms-transform-origin:100% 173px;transform-origin:100% 173px;position:relative}.flip-container .back,.flip-container .front{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute;top:0;left:0}.flip-container .front{z-index:2;-webkit-transform:rotateX(0);transform:rotateX(0)}.flip-container .back{-webkit-transform:rotateX(180deg);transform:rotateX(180deg)}.licenses{margin-top:50px;margin-bottom:50px}.licenses .comment,.licenses .price,.licenses .title,.licenses .usp{display:block;margin:0}.licenses .comment,.licenses .price,.licenses .usp{padding:25px 0}.licenses .price{border-bottom:3px dotted rgba(34,37,56,.5);font-size:50px;line-height:40px;font-weight:100}.licenses .usp{text-align:left;display:inline-block;padding-left:25px;margin:auto}.licenses .usp li{list-style:none;padding:5px 0 5px 25px;position:relative}.licenses .usp li .fa{color:#693;font-size:18px;position:absolute;top:6px;left:0}.licenses .btn{display:block;width:160px;padding:10px 0;margin:auto}.licenses .comment{opacity:.7;line-height:20px}.browsers{font-size:20px}.browsers .fa{margin:0 20px}.page-404 .box{font-size:20px}.page-404 .box h2{font-size:80px;padding:80px 0 10px 0;margin:0;color:#c33}