html, body { font-family: Helvetica; margin: 0; line-height: 1.6; padding: 0; background: #E0EAFF; color: #203040; font-size: 18px; height: 100%; } .Header { width: 100%; background: #506070; } .TitleBox { max-width: 1200px; margin: 0 auto; padding-top: 2em; padding-bottom: 2em; text-align: left; } .Title { text-decoration: none; font-weight: bold; margin: 0; padding-left: 24px; text-align: left; color: #E0EAFF; font-size: 32px; } .HeaderMenu { width: 100%; margin: 0; padding: 0; background-image: linear-gradient(#506070, 1%, #F0F8FF 80%); } .HeaderMenu ul { list-style-type: none; max-width: 1200px; margin: 0 auto; padding: 0; overflow: hidden; } .HeaderMenu ul li { float: left; } .HeaderMenu ul li a { display: block; text-align: center; color: #405060; padding: 16px 24px; text-decoration: none; } .HeaderMenu ul li a:hover { background-image: linear-gradient(#506070, 0.5%, #F0F8FF 10%); color: #304050; } .ContentRow { align-self: center; width: 100%; height: 100%; max-width: 1200px; margin: 0 auto; padding: 0; } .Article { float: left; width: 65%; margin-top: 1.5em; margin-right: 0.5em; } .ArticleTitle { margin-top: 0; margin-bottom: 0; text-align: center; line-height: 1; } .Date { text-align: right; font-size: 14px; color: #607090; margin-bottom: 22px; } .ArticleContent { text-align: left; padding-left: 1em; margin-bottom: 10em; } .ArticlesSummaries { float: left; width: 65%; margin-top: 1.5em; margin-right: 0.5em; } .ArticlesSummariesList { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10em; } .ArticlesSummariesList li { border-bottom-style: solid; border-bottom-color: #b0b0b0; border-bottom-width: 1px; margin-bottom: 1px; } /* Restore default values for uls */ .ArticlesSummariesList li ul { list-style-type: disc; margin: 0; } .ArticlesSummariesList li ul li { border-bottom-width: 0; margin: 0; } .ArticleSummaryTitle { text-decoration: none; font-weight: bold; text-align: left; padding: 0; margin-left: 2em; line-height: 1; font-size: 22px; color: #203040; } .ArticleSummaryTitle:hover { text-decoration: underline; color: #040408; } .ArticleSummaryContent { text-align: left; padding-left: 1em; } .ThroughputComparisonTable { margin: auto; width: fit-content; background-color: #E8F0FF; border-collapse: collapse; border-style: solid; border-color: #b0b0b0; border-width: 1px; } .ThroughputComparisonTable tbody { border-collapse: collapse; border-style: solid; border-color: #b0b0b0; border-width: 1px; } .ThroughputComparisonTable tbody tr { border-collapse: collapse; border-style: solid; border-color: #b0b0b0; border-width: 1px; } .ThroughputComparisonTable tbody tr th { font-weight: 500; padding: 0.25em 0.5em; margin: 50em; border-collapse: collapse; border-style: solid; border-color: #b0b0b0; border-width: 1px; } .LatestPostsColumn { float: left; width: 30%; height: 100%; max-width: 350px; margin-top: 1.5em; padding-top: 1em; padding-left: 20px; border-left-style: solid; border-left-color: #b0b0b0; border-left-width: 3px; overflow: hidden; } .LatestPostsTitle { margin: 0; padding: 0; font-weight: bold; border-bottom-style: solid; border-bottom-color: #b0b0b0; border-bottom-width: 1px; } .LatestPosts { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10em; } .LatestPosts li { float: left; } .LatestPosts li a { display: block; text-align: left; color: #405060; margin-top: 1em; text-decoration: none; } .LatestPosts li a:hover { text-decoration: underline; color: #18283A; } .footer { padding: 20px; text-align: center; background: #ddd; margin-top: 20px; } /* omit the latest posts column if we do not have a lot of horizontal space*/ @media screen and (max-width: 800px) { .LatestPostsColumn { display: none; } .Article { float: center; width: 100%; margin-top: 1.5em; } .ArticlesSummaries { float: center; width: 100%; } } /** * Adapted from 'Coy without shadows' * Original Author: RunDevelopment */ code[class*="language-"], pre[class*="language-"] { font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; font-weight: 500; font-size: 16px; text-align: left; white-space: pre-wrap; word-spacing: normal; word-break: normal; overflow-wrap: normal; line-height: 1.5; -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; } /* Code blocks */ pre[class*="language-"] { background-color: #E8F0FF; background-size: 3em 3em; background-origin: content-box; background-attachment: local; margin: auto; width: fit-content; max-width: 100%; padding: 0.25em 0.5em; border-style: solid; border-color: #b0b0b0; border-width: 1px; } pre[class*="language-"] > code { display: block; padding: 0; margin: 0; } /* Inline code */ :not(pre) > code[class*="language-"] { position: relative; padding: .2em; border-radius: 0.3em; color: #c92c2c; border: 1px solid rgba(0, 0, 0, 0.1); display: inline; white-space: normal; background-color: #fdfdfd; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .token.comment, .token.block-comment, .token.prolog, .token.doctype, .token.cdata { color: #7D8B99; } .token.punctuation, .token.operator { color: #203040; } .token.property, .token.tag, .token.boolean, .token.number, .token.function-name, .token.constant, .token.symbol, .token.deleted { color: #c02a2a; } .token.selector, .token.attr-name, .token.string, .token.char, .token.builtin, .token.inserted { color: #2f9c0a; } .token.function { color: #304090; } .token.entity, .token.url, .token.variable { color: #967455; } .token.atrule, .token.attr-value, .token.keyword, .token.class-name { color: #500470; } .token.regex, .token.important { color: #e90; } .language-css .token.string, .style .token.string { color: #a67f59; background: rgba(255, 255, 255, 0.5); } .token.important { font-weight: 500; } .token.bold { font-weight: 800; } .token.italic { font-style: italic; } .token.entity { cursor: help; } .token.namespace { opacity: .7; }