.palettes h3{color:#b5b8c0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:100%}[class^="teduca-palette-"]{display:flex;flex-direction:column;width:100%;overflow:hidden;border-radius:10px;height:250px;border:3px solid #fff}[class^="color-"] span{color:#fff;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;font-size:14px;font-weight:700;line-height:10px;padding:8px;text-transform:uppercase;transition:all .2s;overflow:hidden;opacity:0;cursor:pointer;--stroke-color:rgba(0,0,0,.2);--stroke-width:1px;text-shadow:var(--stroke-width) 0 0 var(--stroke-color),calc(var(--stroke-width) * -1) 0 0 var(--stroke-color),0 var(--stroke-width) 0 var(--stroke-color),0 calc(var(--stroke-width) * -1) 0 var(--stroke-color);text-shadow:calc(var(--stroke-width) * 1) calc(var(--stroke-width) * 0) 0 var(--stroke-color),calc(var(--stroke-width) * 0.9239) calc(var(--stroke-width) * 0.3827) 0 var(--stroke-color),calc(var(--stroke-width) * 0.7071) calc(var(--stroke-width) * 0.7071) 0 var(--stroke-color),calc(var(--stroke-width) * 0.3827) calc(var(--stroke-width) * 0.9239) 0 var(--stroke-color),calc(var(--stroke-width) * 0) calc(var(--stroke-width) * 1) 0 var(--stroke-color),calc(var(--stroke-width) * -0.3827) calc(var(--stroke-width) * 0.9239) 0 var(--stroke-color),calc(var(--stroke-width) * -0.7071) calc(var(--stroke-width) * 0.7071) 0 var(--stroke-color),calc(var(--stroke-width) * -0.9239) calc(var(--stroke-width) * 0.3827) 0 var(--stroke-color),calc(var(--stroke-width) * -1) calc(var(--stroke-width) * 0) 0 var(--stroke-color),calc(var(--stroke-width) * -0.9239) calc(var(--stroke-width) * -0.3827) 0 var(--stroke-color),calc(var(--stroke-width) * -0.7071) calc(var(--stroke-width) * -0.7071) 0 var(--stroke-color),calc(var(--stroke-width) * -0.3827) calc(var(--stroke-width) * -0.9239) 0 var(--stroke-color),calc(var(--stroke-width) * 0) calc(var(--stroke-width) * -1) 0 var(--stroke-color),calc(var(--stroke-width) * 0.3827) calc(var(--stroke-width) * -0.9239) 0 var(--stroke-color),calc(var(--stroke-width) * 0.7071) calc(var(--stroke-width) * -0.7071) 0 var(--stroke-color),calc(var(--stroke-width) * 0.9239) calc(var(--stroke-width) * -0.3827) 0 var(--stroke-color)}[class^="color-"]:hover span{opacity:1}[class^="color-"]:hover{flex-grow:3}[class^="color-"]{position:relative;overflow:hidden;flex-grow:1;transition:all 300ms ease-in-out}.copied{position:absolute;background-color:#352c40;color:#fff;top:0;width:100%;height:100%;left:0;display:flex;justify-content:center;align-items:center;font-size:14px;animation-name:copied;animation-duration:1s;animation-fill-mode:both}@keyframes copied{0%{opacity:0}20%{opacity:1}80%{opacity:1}100%{opacity:0}}.color-0{flex-grow:2}