GameExpo23/Highscore-Server/server/static/gen/styles.css

@import url("https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700&display=swap");:root{--black:21,21,21;--white:232,227,227;--primary:210,206,97;--secondary:185,77,77;--gold:255,222,70;--silver:229,220,206;--bronze:193,145,69;--darkBlue:9,9,39}*{box-sizing:border-box;font-family:'Merriweather',serif}html{margin:0;padding:0}body{margin:0;padding:0;display:flex;flex-direction:row;background-color:RGB(var(--darkBlue));color:RGB(var(--white))}.background{width:100%;height:100%;object-fit:cover;position:absolute;z-index:1}.app{margin:0 auto;padding:0;width:800px;min-height:100vh;position:relative;display:flex;flex-direction:column;background-color:rgba(var(--darkBlue),0.7);backdrop-filter:blur(5px);z-index:2}.app>table{width:100%}header{padding:1rem;background-color:RGBA(var(--darkBlue),0.7)}header>img{margin-bottom:1rem;width:100%;height:auto;text-align:center}nav{margin-top:.3rem;padding:0;display:flex;flex-direction:row;justify-content:center}nav>span{width:100%}nav>a{margin:auto .15rem;padding:.5rem .7rem;text-decoration:none;white-space:nowrap;font-size:.9em;color:RGB(var(--primary))}nav>a.button{text-decoration:none;background-color:RGBA(var(--white),0.02);color:RGB(var(--white));border-radius:2px;border:0 solid transparent;transition:background-color .2s ease-in-out,transform .1s ease-in-out}nav>a.button:hover{background-color:RGBA(var(--white),0.3);transform:translateY(-0.1rem)}nav>a.button.primary{text-decoration:none;background-color:RGBA(var(--primary),0.02);color:RGB(var(--primary));border-radius:2px;border:0 solid transparent;transition:background-color .2s ease-in-out,transform .1s ease-in-out}nav>a.button.primary:hover{background-color:RGBA(var(--primary),0.3);transform:translateY(-0.1rem)}nav>a.button.secondary{text-decoration:none;background-color:RGBA(var(--secondary),0.02);color:RGB(var(--secondary));border-radius:2px;border:0 solid transparent;transition:background-color .2s ease-in-out,transform .1s ease-in-out}nav>a.button.secondary:hover{background-color:RGBA(var(--secondary),0.3);transform:translateY(-0.1rem)}nav>a>i{font-size:1.25em;display:block}.flash{display:flex;flex-direction:column;justify-content:center;align-items:center}.flash>p{margin:0;padding:.75rem 1rem;width:100%;position:relative;background-color:RGB(var(--darkBlue));color:RGB(var(--primary));transition:background-color .2s ease-in-out,padding .2s ease-in-out}.flash>p>span{position:absolute;top:0;left:0;bottom:0;width:.25rem;display:flex;justify-content:center;align-items:center;background-color:RGB(var(--primary));color:transparent;overflow:hidden;transition:width .2s ease-in-out,color .2s ease-in-out,background-color .2s ease-in-out}.flash>p>span>i{font-size:1.25em}.flash>p:hover{padding:.75rem 1rem .75rem 4rem;background-color:RGBA(var(--primary),0.1);cursor:pointer}.flash>p:hover>span{width:3rem;color:RGB(var(--black))}.flash>p.success{color:RGB(var(--primary))}.flash>p.success>span{background-color:RGB(var(--primary))}.flash>p.success:hover{background-color:RGBA(var(--primary),0.1)}.flash>p.error{color:RGB(var(--secondary))}.flash>p.error>span{background-color:RGB(var(--secondary))}.flash>p.error:hover{background-color:RGBA(var(--secondary),0.1)}main{padding:1rem;height:100%;display:flex;flex-direction:column}main>h2{margin:0 0 1rem 0;font-size:1.5em;color:RGB(var(--white))}main .center-text{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}main .center-text>h2{margin:0;text-align:center;font-size:2em;color:RGB(var(--white))}main .center-text>p{margin:0;text-align:center;font-size:1em;color:RGB(var(--white))}main .center-text>img{margin:1rem auto 0;max-width:100%;max-height:15rem;border-radius:2px}main .block{margin-bottom:1rem;padding:1rem;display:flex;flex-direction:column;background-color:rgba(var(--darkBlue),0.7);border-radius:2px}main .block>h2{margin:0 0 .2rem 0;font-size:1.3em;color:RGB(var(--white))}main .block>p{margin:0 0 1rem 0;font-size:1em}main .block .button{margin:0;padding:.5rem .7rem;text-decoration:none;white-space:nowrap;font-size:.9em;color:RGB(var(--primary));text-decoration:none;background-color:RGBA(var(--white),0.02);color:RGB(var(--white));border-radius:2px;border:0 solid transparent;transition:background-color .2s ease-in-out,transform .1s ease-in-out}main .block .button>i{font-size:1.25em;display:block}main .block .button:hover{background-color:RGBA(var(--white),0.3);transform:translateY(-0.1rem)}main .block .button.primary{text-decoration:none;background-color:RGBA(var(--primary),0.02);color:RGB(var(--primary));border-radius:2px;border:0 solid transparent;transition:background-color .2s ease-in-out,transform .1s ease-in-out}main .block .button.primary:hover{background-color:RGBA(var(--primary),0.3);transform:translateY(-0.1rem)}main .block .button.secondary{text-decoration:none;background-color:RGBA(var(--secondary),0.02);color:RGB(var(--secondary));border-radius:2px;border:0 solid transparent;transition:background-color .2s ease-in-out,transform .1s ease-in-out}main .block .button.secondary:hover{background-color:RGBA(var(--secondary),0.3);transform:translateY(-0.1rem)}main .block>table{width:100%;border-collapse:collapse}main .block>table>tbody>tr>td{padding:0 .5rem .5rem 0;text-align:left;font-size:.9em;color:RGB(var(--white));transition:filter .2s ease-in-out}main .block>table>tbody>tr>td:last-child{width:100%}main .block>table>tbody>tr>td.hidden{filter:blur(5px)}main .block.secondary{border:1px solid RGB(var(--secondary))}main .block.secondary>h2{color:RGB(var(--secondary))}main form{display:flex;flex-direction:column}main form>input{margin:0 0 1rem 0;padding:.7rem 1rem;border:1px solid RGB(var(--white));border-radius:2px;background-color:RGB(var(--darkBlue));color:RGB(var(--white))}main form>input:focus{outline:none;border-color:RGB(var(--primary))}main form>input.error{border-color:RGB(var(--secondary))}main form>button{margin:0;padding:.75rem 1rem;font-weight:bolder;border:transparent;border-radius:2px;background-color:RGB(var(--primary));color:RGB(var(--black))}main form>button:focus-visible,main form>button:hover{outline:none;background-color:RGBA(var(--primary),0.3);color:RGB(var(--primary))}main form>button.disabled{pointer-events:none;opacity:.5}main form>button.secondary{background-color:RGB(var(--secondary));color:RGB(var(--black))}main form>button.secondary:focus-visible,main form>button.secondary:hover{background-color:RGBA(var(--secondary),0.3);color:RGB(var(--secondary))}footer{padding:.5rem 1rem;width:100%;display:flex;flex-direction:row;background-color:RGBA(var(--darkBlue),0.7)}footer>p{margin:0;width:100%;text-align:center;font-size:.8em;white-space:nowrap;color:RGB(var(--white))}footer>p>a{color:RGB(var(--secondary));text-decoration:none}footer>p>a:hover{text-decoration:underline}