Website/css/style.min.css

2 lines
6.1 KiB
CSS
Raw Normal View History

@import"https://fonts.googleapis.com/css2?family=Comic+Neue:wght@700&family=Noto+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Outfit:wght@400;500;700&display=swap";body,input{font-family:"Noto Sans","Noto Color Emoji",sans-serif}h1,h2,h3,h4,h5,h6{font-family:"Outfit","Noto Color Emoji",sans-serif;font-weight:500}.pageHero{font-family:"Comic Neue","Comic Sans MS","Noto Color Emoji",sans-serif}*{-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{overflow-x:hidden}body{margin:0;background:#fff;color:#000}@media(prefers-color-scheme: dark){body{background:#202120;color:#fff}}main{transition:.24s}main.buffering{transform:scale(1.01);transition:.16s;opacity:.4;pointer-events:none;user-select:none}main.transition{transform:scale(0.96);transition:.16s;opacity:0}.container{max-width:960px;width:100%;margin:0 auto;padding:24px;box-sizing:border-box}ul,ol{list-style-position:inside}p{line-height:1.6;opacity:.88}img{max-width:100%}.cards{display:flex;flex-wrap:wrap;gap:8px;width:100%}@media(max-width: 600px){.cards{gap:12px}}.card{position:relative;display:flex;flex-direction:column;box-sizing:border-box;max-width:100%;height:150px;text-decoration:none;border-radius:4px;padding:8px 12px;cursor:pointer;overflow:hidden;outline:1px solid #d0d0d0;background:#f9f9f9;color:#000;transition:.24s;width:calc(33.3333333333% - 6px)}@media(prefers-color-scheme: dark){.card{outline-color:#575757;background:#272727;color:#fff}}.card:hover{outline-width:2px;outline-color:#d0dfd0;background:#f9fff9;color:#527d52;transition:.08s}@media(prefers-color-scheme: dark){.card:hover{outline-color:#575f57;background:#272f27;color:#d0dfd0}}.card:hover .icon{transition:.48s;transform:scale(1.2)}@media(max-width: 800px){.card{width:calc(50% - 4px)}}@media(max-width: 600px){.card{border-radius:8px;width:100%}}.card h1{margin:0;font-size:1.2em;font-weight:400}.card .icon{position:absolute;top:0;right:0;height:100%;aspect-ratio:1/1;object-fit:cover;mask-image:linear-gradient(to right, transparent, rgba(255, 0, 0, 0.3));transition:.64s}@media(prefers-color-scheme: dark){.card .icon{mask-image:linear-gradient(to right, transparent, rgba(255, 0, 0, 0.1))}}.card p{margin:8px 0}a{color:#527d52}@media(prefers-color-scheme: dark){a{color:#d0dfd0}}a:visited{opacity:.9}.pageHero{background-image:linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)),url("/img/Panorama-Lens-Blur.png");background-position:center;background-size:cover;height:220px}@media(prefers-color-scheme: dark){.pageHero{background-image:linear-gradient(rgba(16, 22, 16, 0.9), rgba(16, 22, 16, 0.9)),url("/img/Panorama-Lens-Blur.png")}}.pageHero>.container{height:100%;display:flex;flex-direction:row;align-items:center;justify-content:space-between}@media(max-width: 600px){.pageHero>.container{justify-content:center}}.pageHero>.container>div{display:flex;flex-direction:column;gap:12px}.pageHero>.container>div.Branding{align-items:flex-start}@media(max-width: 600px){.pageHero>.container>div.Branding{align-items:center}}@media(prefers-color-scheme: dark){.pageHero>.container>div.Branding img{filter:invert(1)}}.pageHero>.container>div.Branding span{font-size:24px;opacity:.75}.pageHero>.container>div.Server-Information{align-items:center;gap:4px}@media(max-width: 600px){.pageHero>.container>div.Server-Information{display:none}}.pageHero>.container>div.Server-Information input{text-align:center;font-size:24px}.pageHero>.container>div.Server-Information input:not(:hover,:focus){color:inherit;border-color:rgba(0,0,0,0);background:rgba(0,0,0,0)}.navToggle{z-index:10;position:fixed;top:8px;right:8px;font-size:18px;background:#527d52;color:#fff;padding:8px 24px;border-radius:32px;font-weight:bold;user-select:none;cursor:pointer}@media(min-width: 601px){.navToggle{display:none}}@media(prefers-color-scheme: dark){.navToggle{background:#527d52;color:#fff}}.pageNav{width:100%;border:solid #d0dfd0;border-width:0 0 1px 0;background:#f9fff9}@media(prefers-color-scheme: dark){.pageNav{border-color:#575f57;background:#272f27}}.pageNav>.container{padding:16px 24px;display:flex;flex-wrap:wrap;align-items:center