*, *::after, *::before { box-sizing: border-box } body { > header, > footer { background: $primary-color; box-shadow: 0 3px 24px 2px rgba(0,0,0,0.35) } } html { scrollbar-color: $secondary-color lighten($tertiary-color, 10%) } ::-webkit-scrollbar { background: lighten($tertiary-color, 10%); height: 10px; width: 10px } ::-webkit-scrollbar-thumb { background: $secondary-color; border-radius: 10px } article h2 { margin-bottom: 0 } article h2 { background: $body-color } /* article img { margin-right: 1rem 33% 1rem 1rem } header h1 { padding: 4rem $article-gutter 0 0 } h2, h3 { margin-bottom: 0 } h3+p{margin-top: 0} h1 { background: $background-color } main { background: $body-color; margin: $article-gutter auto } section { border-bottom: 80px solid $background-color } */ /* overrule for nested articles like on home */ /* .home h1, .home, article h2 { background: $background-color } */ html { /* FIXME scrollIntoView does not seem to scroll at all (not only not smooth, no worky) when using this: Chrome 7x somewhere */ /* scroll-behavior: smooth */ } body { background: $background-color; color: $text-color; font: 15px/1.5 "Open Sans", Arial, Liberation Sans, DejaVu Sans, sans-serif; /* font: 18px/1.5 "Open Sans", Arial, Liberation Sans, DejaVu Sans, sans-serif; */ margin: 0; padding: 0 } /* sticky footer */ body { display: flex; min-height: 100vh; flex-direction: column } main { flex: 1 0 0 /* be very explicit for old IE11 */ }