lucht/src/assets/styles/main.css

2 lines
6.9 KiB
CSS
Raw Normal View History

2023-10-06 11:16:52 +00:00
:root{--test-var: #909090;--background-color: black;--background-color-secondary: #202020;--background-color-tertiary: #ff6e6c;--primary: #000;--secondary: #ff6e6c;--text-primary: #1f1135;--text-secondary: #ffffff;--text-tertiary: #301e4e;--link-color: #301e4e;--tag-color: #301e4e;--button-color: #ff636c;--ratio: 1.2;--s-5: calc(var(--s-4) / var(--ratio));--s-4: calc(var(--s-3) / var(--ratio));--s-3: calc(var(--s-2) / var(--ratio));--s-2: calc(var(--s-1) / var(--ratio));--s-1: calc(var(--s0) / var(--ratio));--s0: 1rem;--s1: calc(var(--s0) * var(--ratio));--s2: calc(var(--s1) * var(--ratio));--s3: calc(var(--s2) * var(--ratio));--s4: calc(var(--s3) * var(--ratio));--s5: calc(var(--s4) * var(--ratio));--max-width: 1000px}*,*::before,*::after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role=list],ol[role=list]{list-style:none}html{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}@media(prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:rgba(0,0,0,0)}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}#layout{display:flex;flex-direction:column;min-height:100vh;overflow:hidden;background:var(--primary)}#main-container{width:90%;max-width:var(--max-width);margin:0 auto;padding-bottom:var(--s1);flex:1 0 auto;overflow:hidden}#main-container main{max-width:65ch}h1{font-size:clamp(var(--s3),3vw,var(--s4));margin:0 0 var(--s0)}h2{font-size:clamp(var(--s2),3vw,var(--s3))}h3{font-size:clamp(var(--s1),3vw,var(--s2));margin:0 0 var(--s-1);font-style:italic}h4{margin:var(--s-2) 0;font-size:clamp(var(--s-0),3vw,var(--s1));text-transform:uppercase}p{margin-bottom:var(--s1)}ul{margin-top:var(--s0);margin-bottom:var(--s0)}a{color:var(--link-color)}*{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif}h1,h2,h3,h4,h5,h6{font-family:"Bitter","Bookman Old Style",serif}header{min-width:100%}#header--container{width:90%;max-width:var(--max-width);padding:var(--s1) 0;margin:0 auto;display:flex;flex-direction: