:root{display:flex;justify-content:center;align-items:center;background-color:#1b2430}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background-color:#d6d5a8;border-radius:10px;border:2px solid #1B2430}::-webkit-scrollbar-track{background-color:#1b2430;border-radius:10px}::-webkit-scrollbar-horizontal{height:10px}::-webkit-scrollbar-thumb:horizontal{background-color:#d6d5a8;border-radius:10px;border:2px solid #1B2430}::-webkit-scrollbar-track:horizontal{background-color:#1b2430;border-radius:10px}h1,h2,h3,p,a{font-family:Poppins;color:#d6d5a8}.font-changer{display:flex;flex-direction:column;align-items:center;margin-top:20px;width:90%;max-width:1200px}.font-changer input{width:100%;height:50px;padding:10px;font-size:16px;border:none;border-bottom:2px solid #D6D5A8;border-radius:5px;background-color:transparent;color:#d6d5a8;box-sizing:border-box;resize:vertical}.font-options{display:flex;flex-wrap:wrap;justify-content:center;max-height:400px;overflow-y:auto;width:100%}.font-options-group{margin:10px}.font-options-group h3{margin-bottom:5px;color:#d6d5a8}.font-options button{padding:10px 15px;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s;margin:5px;background-color:#d6d5a8;color:#333;font-size:12px}.font-options button:hover{background-color:#ddd}.examples,.variants{width:80%;overflow-y:auto;max-height:500px}.examples{margin-top:20px;text-align:left}.examples p{border-bottom:1px solid #ddd;padding:5px 0}.App{display:flex}.App-header{display:flex;justify-content:center;padding:2rem}.App-logo{height:50%}h1,h2,h3{opacity:0}.button{border-radius:.5rem;background-color:transparent;color:#d6d5a8;border:2px solid #D6D5A8;cursor:pointer;padding:.5rem}.button:hover{opacity:.5;transition:.3s all;-webkit-transition:.3s all;-moz-transition:.3s all;-ms-transition:.3s all;-o-transition:.3s all}@media (max-width: 764px){.App-logo{height:400px}}