.c-code-demo{margin-top:var(--g-m);background-color:var(--c-light);padding:var(--p-m);border-radius:var(--b-r-m)}.c-code-demo li{margin-top:0}.c-code-demo .filter-btns{gap:var(--g-s);flex-wrap:wrap;margin-top:0}.c-code-demo .filter-btns .filter{display:block;font-size:var(--f-s-xxs);font-weight:500;color:var(--c-heading);padding:4px 16px;border-radius:var(--b-r-l);background-color:var(--c-lightest);border:1px solid var(--c-border);transition:all .2s ease-in-out}.c-code-demo .filter-btns .filter.active{color:var(--c-primary);border-color:var(--c-primary)}.c-code-demo .filter-btns .filter:hover{color:var(--c-primary);border-color:var(--c-primary)}.c-code-demo .filter-btns .separator{border-right:1px solid var(--c-border)}.c-code-demo .blocks{margin-top:var(--g-s);height:400px}.c-code-demo .blocks li{width:100%;height:100%}.c-code-demo .blocks li .block{height:100%;margin-top:0;border:1px solid var(--c-border);border-radius:var(--b-r-s);background-color:var(--c-lightest);overflow:auto}.c-code-demo .blocks li .block .c-code-block,.c-code-demo .blocks li .block .c-code-block pre,.c-code-demo .blocks li .block .c-code-block pre code{height:100%;margin-top:0}.c-code-demo .blocks li .block .block-demo{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--g-l);font-size:var(--f-s-m);font-weight:700}.c-code-demo .blocks li .block .block-demo .element{cursor:default;color:var(--c-heading)}#animateonscroll-code-demo .blocks li .block .block-demo{cursor:ns-resize}#animateonscroll-code-demo .blocks li .block .block-demo{height:300%}#animatesequence-code-demo-1 .blocks li .block .block-demo .element .highlight-1{background-color:var(--c-light);padding:var(--p-xxs) var(--p-xs);border-radius:var(--b-r-xs)}#animatesequence-code-demo-1 .blocks li .block .block-demo .element .highlight-2{border-bottom:3px solid var(--c-primary)}#animatesequence-code-demo-1 .blocks li .block .block-demo .element .highlight-3{color:var(--c-primary)}@media only screen and (max-width:475px){.c-code-demo .blocks{height:300px}}