@charset "UTF-8"; /* This is needed because Chrome sometimes thinks the bundled stylesheet is Windows-1252 instead of UTF-8 for some reason. Also, ensure this file is saved *without* the UTF-8 BOM. */ @font-face { font-family: SegoeUI-Light; font-display: swap; src: local('Segoe UI Light'), local('SegoeUI-Light'), local('Segoe WP Light')/*, url(/versionless/webfonts/segoeui_light.woff2) format('woff2'), url(/versionless/webfonts/segoeui_light.woff) format('woff'), url(/versionless/webfonts/segoeui_light.ttf) format('truetype')*/ } @font-face { font-family: SegoeUI-SemiLight; font-display: swap; src: local('Segoe UI Semilight'), local('SegoeUI-Semilight'), local('Segoe WP Semilight')/*, url(/versionless/webfonts/segoeui_semilight.woff2) format('woff2'), url(/versionless/webfonts/segoeui_semilight.woff) format('woff'), url(/versionless/webfonts/segoeui_semilight.ttf) format('truetype')*/ } @font-face { font-family: SegoeUI; font-display: swap; src: local('Segoe UI'), local('SegoeUI'), local('Segoe WP')/*, url(/versionless/webfonts/segoeui_regular.woff2) format('woff2'), url(/versionless/webfonts/segoeui_regular.woff) format('woff'), url(/versionless/webfonts/segoeui_regular.ttf) format('truetype')*/ } @font-face { font-family: SegoeUI-SemiBold; font-display: swap; src: local('Segoe UI Semibold'), local('SegoeUI-Semibold'), local('Segoe WP Semibold')/*, url(/versionless/webfonts/segoeui_semibold.woff2) format('woff2'), url(/versionless/webfonts/segoeui_semibold.woff) format('woff'), url(/versionless/webfonts/segoeui_semibold.ttf) format('truetype')*/ } body { /*font-family: -apple-system,BlinkMacSystemFont,SegoeUI-SemiBold,Segoe UI,Roboto,Noto Sans,Ubuntu,Droid Sans,Helvetica Neue,sans-serif; commented out because I don't think `SegoeUI-SemiBold` should be a body font. But see in User.master.css though... */ font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Droid Sans,Helvetica Neue,sans-serif; font-weight: 400; font-size: 14px; /* This is Rss1's font-size on , the Chrome default is 16px otherwise. */ padding: 1px 0.5em; /* Padding is `0 10px` in the old style, 0.5em is 7px in this sheet. */ padding: 1px 10px; /* Nvm, 10px honestly looks better. */ max-width: 1360px; max-width: 1600px; /* 1600px wide with the shop-chat sidebar */ margin: 0 auto; /* This is the background from the Fabric.css I was experimenting with. I don't think this really adds any value... */ /*background-image: linear-gradient(to bottom, white, white 50px, #fafafa);*/ background-color: white; background-color: var(--color-background); color: black; color: var(--color-foreground); } [hidden] { display: none !important; } html.sandbox { border: 3px solid #dbb307; border-radius: 15px; } /* @media screen and (min-width: 1900px) { body { max-width: 2048px; } } */ .isPopupOrPreview > body { margin: 0; padding: 1em 0; } @media screen and (min-width: 1360px) { .isPopupOrPreview > body { margin: 0 auto; } } .isPopupOrPreview > body > .announcements-infobar, .isPopupOrPreview > body > .announcements-modal, /* Or maybe show modal announcements inside popups? */ .isPopupOrPreview > body > header, .isPopupOrPreview > body > nav, .isPopupOrPreview > body > footer, html:not(.isPopup) .onlyPopup, html:not(.isPopup) .hasOnlyPopup { /* `.hasOnlyPopup` is a server-side-rendered class indicating the element contains only `.onlyPopup` content, so the container element can be hidden too. It sucks that CSS's :empty can't work like that. */ display: none; } /* Because the popup header is hidden, adjust the margins/padding of the so it visually becomes the popup heading. */ /* I wonder if these should be moved to User.master.css? */ html.isPopupOrPreview.popup-noHeader > body { padding: 1px; /* 1px padding to stop elements getting "grazed" by the parent