1html { 2 overflow-x: auto; 3 overflow-y: scroll; 4 word-break: normal; 5} 6 7html, 8body { 9 margin: 0; 10 padding: 0; 11 height: 100%; 12 width: 100%; 13 word-wrap: break-word; 14} 15 16@media screen and (prefers-reduced-motion: no-preference) { 17 html, 18 body { 19 scroll-behavior: smooth; 20 } 21} 22 23main, 24header, 25footer, 26article, 27section, 28aside, 29details, 30summary { 31 margin: 0 auto; 32 margin-bottom: $md-pad; 33 width: 100%; 34} 35 36main { 37 display: block; 38 margin: 0 auto; 39 max-width: $large-breakpoint; 40 padding: 0 $md-pad $md-pad; 41} 42 43body { 44 background-color: $bg-light; 45 word-break: normal; 46} 47 48 49/* @media (prefers-color-scheme: dark) { 50 body { 51 background-color: $bg-dark; 52 } 53} */ 54 55footer { 56 border-top: $border; 57 padding: $md-pad 0; 58 text-align: center; 59 p { 60 margin-bottom: 0; 61 } 62} 63 64hr { 65 border: 0; 66 border-top: $border; 67 display: block; 68 margin-top: $xlg-pad; 69 margin-bottom: $xlg-pad; 70 width: 20%; 71 box-sizing: content-box; 72 height: 0; 73 overflow: visible; 74} 75 76img { 77 height: auto; 78 max-width: 100%; 79 vertical-align: baseline; 80} 81 82::selection { 83 color: $white; 84 background: $primary; 85} 86 87:focus { 88 outline: .125rem solid $focus; 89 outline-offset: .125rem; 90} 91 92embed, 93iframe, 94video { 95 border: 0; 96} 97