From de79a3503118566bd58a94447a4988a38605d8ab Mon Sep 17 00:00:00 2001 From: =?utf8?q?Vladim=C3=ADr=20Vondru=C5=A1?= Date: Wed, 13 Jun 2018 12:08:01 +0200 Subject: [PATCH] css: separate page layout styling out from m-components.css. For the presentation framework I need the responsiveness, typography, components but definitely not popup menus or jumbo article styling. So away it goes, into a new m-layout.css file. This also means the theme setup is now in a separate m-theme-*.css file and the m-dark.css / m-light.css is just a "driver file" that imports everything else. There will be a m-dark-presentation.css / m-light-presentation.css driver file as well. --- css/m-components.css | 520 +----- css/m-dark+doxygen.compiled.css | 2080 ++++++++++++------------ css/m-dark.compiled.css | 2080 ++++++++++++------------ css/m-dark.css | 128 +- css/m-dark.doxygen.compiled.css | 2 +- css/m-layout.css | 542 ++++++ css/m-light+doxygen.compiled.css | 2080 ++++++++++++------------ css/m-light.compiled.css | 2080 ++++++++++++------------ css/m-light.css | 126 +- css/m-light.doxygen.compiled.css | 2 +- css/m-theme-dark.css | 151 ++ css/m-theme-light.css | 149 ++ css/postprocess.py | 4 +- css/postprocess.sh | 4 +- doc/css.rst | 43 +- doc/css/components.rst | 4 +- doc/css/page-layout.rst | 5 +- doc/css/themes.rst | 30 +- doc/css/typography.rst | 4 +- pelican-theme/static/m-layout.css | 1 + pelican-theme/static/m-theme-dark.css | 1 + pelican-theme/static/m-theme-light.css | 1 + 22 files changed, 5066 insertions(+), 4971 deletions(-) create mode 100644 css/m-layout.css create mode 100644 css/m-theme-dark.css create mode 100644 css/m-theme-light.css create mode 120000 pelican-theme/static/m-layout.css create mode 120000 pelican-theme/static/m-theme-dark.css create mode 120000 pelican-theme/static/m-theme-light.css diff --git a/css/m-components.css b/css/m-components.css index 071c959e..55bec646 100644 --- a/css/m-components.css +++ b/css/m-components.css @@ -129,445 +129,6 @@ code.m-console { background-color: var(--console-background-color); } -/* Header navigation */ -body > header > nav { - width: 100%; - background-color: var(--header-background-color); - min-height: 3rem; -} -body > header > nav.m-navbar-landing, -body > header > nav.m-navbar-cover { - background-color: transparent; - position: relative; -} -body > header > nav.m-navbar-landing { - opacity: 0.8; -} -body > header > nav.m-navbar-cover { - background-color: var(--header-background-color-jumbo); - opacity: 1; -} -body > header > nav.m-navbar-landing:hover, -body > header > nav.m-navbar-cover:hover { - background-color: var(--header-background-color-landing); - opacity: 1; -} -body> header > nav.m-navbar-landing:target, -body> header > nav.m-navbar-cover:target { - background-color: var(--header-background-color); - opacity: 1; -} -body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { - visibility: hidden; -} -body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { - visibility: visible; -} -body > header > nav { - margin-left: auto; - margin-right: auto; - color: var(--header-color); -} -body > header > nav a { - text-decoration: var(--link-decoration-nav); - text-transform: var(--nav-menu-case); - display: inline-block; - vertical-align: middle; - line-height: 2.75rem; - color: var(--header-link-color); -} -body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { - text-transform: var(--nav-brand-case); - font-weight: var(--heading-font-weight); - font-size: 1.125rem; - padding-left: 1rem; - padding-right: 1rem; -} -body > header > nav a#m-navbar-brand .m-thin { - font-weight: normal; -} -body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { - content:'\2630'; -} -body > header > nav #m-navbar-collapse { - padding-bottom: 1rem; -} -body > header > nav #m-navbar-collapse li { - border-style: solid; - border-color: transparent; - border-width: 0 0 0 0.25rem; - margin-left: -1rem; -} -body > header > nav #m-navbar-collapse li a { - border-style: solid; - border-color: transparent; - line-height: 1.5rem; - margin-left: -0.25rem; - padding-left: 0.75rem; - border-width: 0 0 0 0.25rem; - width: 100%; -} -body > header > nav #m-navbar-collapse li a#m-navbar-current { - color: var(--header-link-current-color); - border-color: var(--header-link-current-color); -} -body > header > nav ol { - list-style-type: none; - margin: 0; -} -body > header > nav ol ol { - padding-left: 1.5rem; -} -body > header > nav [class*='m-col-'] { - padding-top: 0; - padding-bottom: 0; -} -body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { - color: var(--header-link-active-color); -} -body > header > nav #m-navbar-collapse li:hover { - border-color: var(--header-link-active-color); -} -body > header > nav #m-navbar-collapse li a:hover, -body > header > nav #m-navbar-collapse li a:focus, -body > header > nav #m-navbar-collapse li a:active { - border-color: var(--header-link-active-color); - background-color: var(--header-link-active-background-color); -} -body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { - background-color: var(--header-link-active-background-color-semi); -} - -/* Header navigation -- collapsible part */ -body > header > nav #m-navbar-hide { - display: none; -} -body > header > nav:target #m-navbar-collapse { - display: block; -} -body > header > nav:target #m-navbar-show { - display: none; -} -body > header > nav:target #m-navbar-hide { - display: inline-block; -} - -/* Header navigation -- 768px and up (tablets, desktops) */ -@media screen and (min-width: 768px) { - body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, - body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { - display: none; - } - body > header > nav #m-navbar-collapse li a { - line-height: 2.75rem; - } - body > header > nav a, body > header > nav #m-navbar-collapse li a { - margin-left: 0; - padding-left: 1rem; - padding-right: 1rem; - white-space: nowrap; - } - body > header > nav #m-navbar-collapse { - padding-bottom: 0; - } - body > header > nav #m-navbar-collapse li ol { - background-color: var(--header-background-color); - } - body > header > nav #m-navbar-collapse ol ol li { - margin-left: 0; - padding-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse ol ol li a { - padding-left: 0.75rem; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li { - margin-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li > a { - border-width: var(--header-border-width); - } - body > header > nav #m-navbar-collapse ol { - padding-left: 0; - padding-right: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { - float: left; - } - body > header > nav #m-navbar-collapse ol ol { - z-index: 99999; - position: absolute; - visibility: hidden; - } - body > header > nav #m-navbar-collapse li:hover ol { - visibility: visible; - } -} - -/* Footer navigation */ -body > footer { - width: 100%; -} -body > footer > nav { - padding-top: 1rem; - padding-bottom: 1rem; - font-size: var(--footer-font-size); - text-align: center; - color: var(--footer-color); - background-color: var(--footer-background-color); -} -body > footer > nav h3, body > footer > nav h3 a { - text-transform: var(--nav-heading-case); - font-weight: normal; -} -body > footer > nav ul { - list-style-type: none; - padding: 0; - margin: 0; -} -body > footer > nav a { - text-decoration: var(--link-decoration-nav); - text-transform: var(--nav-menu-case); - color: var(--footer-link-color); -} -body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { - color: var(--footer-link-active-color); -} - -/* Main content */ -body > main { - padding-top: 1rem; - padding-bottom: 1rem; -} - -/* Page heading (not in
), breadcrumb naviation on pages */ -article h1 { - font-size: 1.75rem; -} -article h1 .m-breadcrumb { - color: var(--dim-color); - font-weight: normal; -} -article h1 .m-breadcrumb a { - color: var(--article-heading-color); -} -article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { - color: var(--article-heading-active-color); -} - -/* Article elements */ -article > header h1 { - font-size: 2rem; - margin-bottom: 0.5rem; -} -article h1 a, article > header h1, article > header h1 a, -article section > h2, article section > h2 a, -article section > h3, article section > h3 a, -article section > h4, article section > h4 a, -article section > h5, article section > h5 a, -article section > h6, article section > h6 a { - color: var(--article-heading-color); -} -article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, -article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, -article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, -article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, -article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, -article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { - color: var(--article-heading-active-color); -} -article > header .m-date { - display: block; - width: 2.5rem; - float: left; - text-align: center; - line-height: 95%; - font-size: 0.75rem; - font-weight: normal; - white-space: nowrap; - border-right-style: solid; - border-right-width: 0.125rem; - border-color: var(--article-heading-color); - padding-right: 0.75rem; - margin-top: -0.1rem; - margin-right: 0.75rem; - margin-bottom: 0.25rem; -} -article > header .m-date-day { - display: block; - font-weight: bold; - padding-top: 0.2rem; - padding-bottom: 0.15rem; - font-size: 1.25rem; -} -article > header p { - color: var(--article-header-color); - font-size: 1.125rem; -} -article > header h1::after { - content: " "; - clear: both; - display: table; -} -article > footer { - color: var(--article-footer-color); -} -article > footer p { - font-style: italic; - font-size: 0.85rem; - text-indent: 0; -} - -/* Article -- dynamic section headers */ -article section:target { - margin-left: -1.0rem; - border-left-style: solid; - border-left-width: 0.25rem; - padding-left: 0.75rem; - border-color: var(--article-heading-color); -} -article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, -article section > h4 a, article section > h5 a, article section > h6 a { - text-decoration: var(--link-decoration-heading); -} - -/* Landing page, jumbo article */ -#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { - background-size: cover; - background-color: var(--cover-image-background-color); - background-position: center center; - background-repeat: no-repeat; - margin-top: -4rem; - padding-top: 5rem; -} -#m-landing-image { - color: #ffffff; -} -#m-cover-image { - height: 30rem; - margin-bottom: -26rem; -} -#m-landing-cover h1 { - font-size: 2.8rem; - margin-top: -0.5rem; - padding-left: var(--paragraph-indent); - padding-bottom: 1rem; - text-transform: var(--landing-header-case); -} -#m-landing-cover { - padding-bottom: 10rem; - margin-bottom: -6rem; -} -article#m-jumbo { - margin-top: -1rem; -} -#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { - background: linear-gradient(transparent 0%, transparent 50%, var(--background-color) 100%); - width: 100%; - height: 100%; -} -article#m-jumbo > header h1, article#m-jumbo > header h2 { - text-align: center; - font-weight: bold; -} -article#m-jumbo > header a { - text-decoration: none; -} -article#m-jumbo > header #m-jumbo-cover { - padding-bottom: 5rem; -} -article#m-jumbo > header #m-jumbo-image { - font-size: 2.5vmin; - margin-bottom: -3rem; -} -article#m-jumbo > header h1 { - font-size: 10vmin; -} -article#m-jumbo > header h2 { - font-size: 3vmin; -} -/* 2.5vmin equals to 16px (= 1 rem) on 640px, use that as the lower limit */ -@media screen and (max-height: 640px) , screen and (max-width: 640px) { - article#m-jumbo > header h1 { - font-size: 3rem; - } - article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { - font-size: 1rem; - } -} - -article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { - color: #ffffff; -} -article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { - color: #f0f0f0; -} - -article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { - color: #000000; -} -article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { - color: #0f0f0f; -} - -/* News list on landing pages */ -.m-landing-news h3 a { - color: var(--color); - text-decoration: none; - text-transform: var(--nav-heading-case); -} -.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { - color: var(--article-heading-color); -} -.m-landing-news time { - display: inline-block; - margin-left: 1rem; - float: right; -} - -/* Article pagination */ -.m-article-pagination { - text-align: center; - padding: 1rem; -} - -/* Right navigation panel */ -nav.m-navpanel { - text-align: center; -} -nav.m-navpanel h3 { - text-transform: var(--nav-heading-case); - font-weight: normal; -} -nav.m-navpanel ol { - text-transform: var(--nav-categories-case); -} -nav.m-navpanel ol, nav.m-navpanel ul { - list-style-type: none; - padding: 0; -} -nav.m-navpanel a { - color: var(--navpanel-link-color); - text-decoration: var(--link-decoration-nav); -} -nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { - color: var(--navpanel-link-active-color); -} - -/* Tag cloud */ -ul.m-tagcloud li { display: inline; } -ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } -ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } -ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } -ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } -ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } - /* Utility */ div.m-scroll { max-width: 100%; @@ -1223,9 +784,6 @@ figure.m-code-figure > pre:first-child, figure.m-console-figure > pre:first-chil border-bottom-left-radius: 0; border-bottom-right-radius: 0; } -article section:target figure.m-code-figure, article section:target figure.m-console-figure { - z-index: 1; /* so the selection border isn't above figure border */ -} /* Colored figure */ figure.m-figure.m-default:before { border-color: var(--default-filled-background-color); } @@ -1372,75 +930,6 @@ figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m- } } -/* Active sections in inflatable content affect left border of some components */ -.m-container-inflatable section:target > .m-note, -.m-container-inflatable section:target > .m-frame, -.m-container-inflatable section:target > .m-block, -.m-container-inflatable section:target > pre, -.m-container-inflatable section:target > figure.m-code-figure > pre:first-child, -.m-container-inflatable section:target > figure.m-console-figure > pre:first-child, -.m-container-inflatable section:target section > .m-note, -.m-container-inflatable section:target section > .m-frame, -.m-container-inflatable section:target section > .m-block, -.m-container-inflatable section:target section > pre, -.m-container-inflatable section:target section > figure.m-code-figure > pre:first-child, -.m-container-inflatable section:target section > figure.m-console-figure > pre:first-child { - margin-left: -1.0rem; - border-left-style: solid; - border-left-width: 0.25rem; - border-top-left-radius: 0; - border-bottom-left-radius: 0; - padding-left: 0.75rem; -} -.m-container-inflatable section:target > figure.m-code-figure::before, -.m-container-inflatable section:target > figure.m-console-figure::before, -.m-container-inflatable section:target section > figure.m-code-figure::before, -.m-container-inflatable section:target section > figure.m-console-figure::before { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-left-width: 0.25rem; -} -.m-container-inflatable section:target > pre, -.m-container-inflatable section:target > figure.m-code-figure > pre:first-child, -.m-container-inflatable section:target > figure.m-console-figure > pre:first-child, -.m-container-inflatable section:target section > pre, -.m-container-inflatable section:target section > figure.m-code-figure > pre:first-child, -.m-container-inflatable section:target section > figure.m-console-figure > pre:first-child { - border-color: var(--line-color); -} -.m-container-inflatable section:target > figure.m-code-figure::before, -.m-container-inflatable section:target > figure.m-console-figure::before, -.m-container-inflatable section:target > .m-note.m-default, -.m-container-inflatable section:target section > figure.m-code-figure::before, -.m-container-inflatable section:target section > figure.m-console-figure::before, -.m-container-inflatable section:target section > .m-note.m-default { - border-left-color: var(--line-color); -} -.m-container-inflatable section:target > .m-note.m-primary, -.m-container-inflatable section:target section > .m-note.m-primary { - border-left-color: var(--primary-color); -} -.m-container-inflatable section:target > .m-note.m-success, -.m-container-inflatable section:target section > .m-note.m-success { - border-left-color: var(--success-color); -} -.m-container-inflatable section:target > .m-note.m-warning, -.m-container-inflatable section:target section > .m-note.m-warning { - border-left-color: var(--warning-color); -} -.m-container-inflatable section:target > .m-note.m-danger, -.m-container-inflatable section:target section > .m-note.m-danger { - border-left-color: var(--danger-color); -} -.m-container-inflatable section:target > .m-note.m-info, -.m-container-inflatable section:target section > .m-note.m-info { - border-left-color: var(--info-color); -} -.m-container-inflatable section:target > .m-note.m-dim, -.m-container-inflatable section:target section > .m-note.m-dim { - border-left-color: var(--dim-color); -} - /* Code block (uses Pygments CSS classes) */ pre.m-code span.hll { margin-left: -1.0rem; @@ -1514,16 +1003,13 @@ div.m-math.m-dim svg, svg.m-math.m-dim, div.m-plot svg .m-bar.m-dim { /* Spacing after every block element, but not after the last */ p, ul, ol, dl, blockquote, pre, figure.m-code-figure, figure.m-console-figure, -hr, article, article > header, article section, -.m-note, .m-frame, .m-block, div.m-button, -div.m-scroll, table.m-table, div.m-image, img.m-image, svg.m-image, -figure.m-figure, .m-imagegrid, div.m-math { +hr, .m-note, .m-frame, .m-block, div.m-button, div.m-scroll, table.m-table, +div.m-image, img.m-image, svg.m-image, figure.m-figure, .m-imagegrid, div.m-math { margin-bottom: 1rem; } p:last-child, ul:last-child, ol:last-child, dl:last-child, blockquote:last-child, pre:last-child, figure.m-code-figure:last-child, figure.m-console-figure:last-child, -hr:last-child, article:last-child, article section:last-child, -.m-note:last-child, .m-frame:last-child, .m-block:last-child, +hr:last-child, .m-note:last-child, .m-frame:last-child, .m-block:last-child, div.m-button:last-child, div.m-scroll:last-child, table.m-table:last-child, img.m-image:last-child, svg.m-image:last-child, div.m-image:last-child, figure.m-figure:last-child, .m-imagegrid:last-child, div.m-math:last-child { diff --git a/css/m-dark+doxygen.compiled.css b/css/m-dark+doxygen.compiled.css index 12ce7b87..83008da9 100644 --- a/css/m-dark+doxygen.compiled.css +++ b/css/m-dark+doxygen.compiled.css @@ -487,1172 +487,1267 @@ code { code.m-console { background-color: #000000; } -body > header > nav { - width: 100%; - background-color: #22272e; - min-height: 3rem; +div.m-scroll { + max-width: 100%; + overflow-x: auto; } -body > header > nav.m-navbar-landing, -body > header > nav.m-navbar-cover { - background-color: transparent; - position: relative; +.m-fullwidth { + width: 100%; } -body > header > nav.m-navbar-landing { - opacity: 0.8; +.m-text-center, .m-text-center.m-noindent, table.m-table th.m-text-center, .m-text-center p { + text-align: center; } -body > header > nav.m-navbar-cover { - background-color: rgba(34, 39, 46, 0.25); - opacity: 1; +.m-text-left, .m-text-left.m-noindent, table.m-table th.m-text-left, .m-text-right p { + text-align: left; } -body > header > nav.m-navbar-landing:hover, -body > header > nav.m-navbar-cover:hover { - background-color: rgba(34, 39, 46, 0.75); - opacity: 1; +.m-text-right, .m-text-right.m-noindent, table.m-table th.m-text-right, .m-text-right p { + text-align: right; } -body> header > nav.m-navbar-landing:target, -body> header > nav.m-navbar-cover:target { - background-color: #22272e; - opacity: 1; +.m-text-top, table.m-table th.m-text-top, table.m-table td.m-text-top { + vertical-align: top; } -body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { - visibility: hidden; +.m-text-middle, table.m-table th.m-text-middle, table.m-table td.m-text-middle { + vertical-align: middle; } -body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { - visibility: visible; +.m-text-bottom, table.m-table th.m-text-bottom, table.m-table td.m-text-bottom { + vertical-align: bottom; } -body > header > nav { - margin-left: auto; - margin-right: auto; - color: #ffffff; +.m-text.m-small { + font-size: 85.4%; } -body > header > nav a { - text-decoration: none; - text-transform: none; - display: inline-block; - vertical-align: middle; - line-height: 2.75rem; - color: #ffffff; +.m-text.m-big { + font-size: 117%; } -body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { - text-transform: uppercase; +.m-text.m-strong { font-weight: bold; - font-size: 1.125rem; - padding-left: 1rem; - padding-right: 1rem; } -body > header > nav a#m-navbar-brand .m-thin { +.m-text.m-em { + font-style: italic; +} +h1 .m-thin, h2 .m-thin, h3 .m-thin, h4 .m-thin, h5 .m-thin, h6 .m-thin { font-weight: normal; } -body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { - content:'\2630'; +ul.m-unstyled, ol.m-unstyled { + list-style-type: none; + padding-left: 0; } -body > header > nav #m-navbar-collapse { - padding-bottom: 1rem; +ul[class*='m-block-'], ol[class*='m-block-'] { + padding-left: 0; } -body > header > nav #m-navbar-collapse li { - border-style: solid; - border-color: transparent; - border-width: 0 0 0 0.25rem; - margin-left: -1rem; +ul[class*='m-block-'] li, ol[class*='m-block-'] li { + display: inline; } -body > header > nav #m-navbar-collapse li a { - border-style: solid; - border-color: transparent; - line-height: 1.5rem; - margin-left: -0.25rem; - padding-left: 0.75rem; - border-width: 0 0 0 0.25rem; - width: 100%; +ul[class*='m-block-bar-'] li:not(:last-child)::after, ol[class*='m-block-bar-'] li:not(:last-child)::after { + content: " | "; } -body > header > nav #m-navbar-collapse li a#m-navbar-current { - color: #5b9dd9; - border-color: #5b9dd9; +@media screen and (min-width: 576px) { + ul.m-block-bar-s, ol.m-block-bar-s { padding-left: 2rem; } + ul.m-block-bar-s li, ol.m-block-bar-s li { display: list-item; } + ul.m-block-bar-s li:not(:last-child)::after, ol.m-block-bar-s li:not(:last-child)::after { content: ""; } } -body > header > nav ol { - list-style-type: none; - margin: 0; +@media screen and (min-width: 768px) { + ul.m-block-bar-m, ol.m-block-bar-m { padding-left: 2rem; } + ul.m-block-bar-m li, ol.m-block-bar-m li { display: list-item; } + ul.m-block-bar-m li:not(:last-child)::after, ol.m-block-bar-m li:not(:last-child)::after { content: ""; } } -body > header > nav ol ol { - padding-left: 1.5rem; +@media screen and (min-width: 992px) { + ul.m-block-bar-l, ol.m-block-bar-l { padding-left: 2rem; } + ul.m-block-bar-l li, ol.m-block-bar-l li { display: list-item; } + ul.m-block-bar-l li:not(:last-child)::after, ol.m-block-bar-l li:not(:last-child)::after { content: ""; } } -body > header > nav [class*='m-col-'] { - padding-top: 0; - padding-bottom: 0; +p.m-poem { + text-indent: 0; + text-align: left; + margin-left: 1.5rem; } -body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { - color: #a5c9ea; +p.m-transition { + color: #405363; + text-indent: 0; + text-align: center; + font-size: 2rem; } -body > header > nav #m-navbar-collapse li:hover { - border-color: #a5c9ea; +dl.m-diary { + margin-bottom: 1.25rem; } -body > header > nav #m-navbar-collapse li a:hover, -body > header > nav #m-navbar-collapse li a:focus, -body > header > nav #m-navbar-collapse li a:active { - border-color: #a5c9ea; - background-color: #292f37; +dl.m-diary:last-child { + margin-bottom: 0.25rem; } -body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { - background-color: rgba(41, 47, 55, 0.5); +dl.m-diary dt { + font-weight: bold; + width: 3.5rem; + float: left; + clear: both; + padding-top: 0.25rem; } -body > header > nav #m-navbar-hide { - display: none; +dl.m-diary dd { + padding-top: 0.25rem; + padding-left: 3.5rem; } -body > header > nav:target #m-navbar-collapse { - display: block; +.m-note { + border-radius: 0.2rem; + padding: 1rem; } -body > header > nav:target #m-navbar-show { - display: none; +.m-note pre, .m-note code { + background-color: rgba(34, 39, 46, 0.5); } -body > header > nav:target #m-navbar-hide { - display: inline-block; +.m-frame { + background-color: #2f363f; + border-style: solid; + border-width: 0.125rem; + border-radius: 0.2rem; + border-color: #405363; + padding: 0.875rem; } -@media screen and (min-width: 768px) { - body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, - body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { - display: none; - } - body > header > nav #m-navbar-collapse li a { - line-height: 2.75rem; - } - body > header > nav a, body > header > nav #m-navbar-collapse li a { - margin-left: 0; - padding-left: 1rem; - padding-right: 1rem; - white-space: nowrap; - } - body > header > nav #m-navbar-collapse { - padding-bottom: 0; - } - body > header > nav #m-navbar-collapse li ol { - background-color: #22272e; - } - body > header > nav #m-navbar-collapse ol ol li { - margin-left: 0; - padding-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse ol ol li a { - padding-left: 0.75rem; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li { - margin-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li > a { - border-width: 0 0 0.25rem 0; - } - body > header > nav #m-navbar-collapse ol { - padding-left: 0; - padding-right: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { - float: left; - } - body > header > nav #m-navbar-collapse ol ol { - z-index: 99999; - position: absolute; - visibility: hidden; - } - body > header > nav #m-navbar-collapse li:hover ol { - visibility: visible; - } +.m-block { + border-style: solid; + border-width: 0.0625rem; + border-left-width: 0.25rem; + border-radius: 0.2rem; + border-color: #405363; + padding: 0.9375rem 0.9375rem 0.9375rem 0.75rem; } -body > footer { - width: 100%; +.m-block.m-badge::after { + content: ' '; + display: block; + clear: both; } -body > footer > nav { - padding-top: 1rem; - padding-bottom: 1rem; - font-size: 0.85rem; - text-align: center; - color: #c5c5c5; - background-color: #444e5c; +.m-block.m-badge h3 { + margin-left: 5rem; } -body > footer > nav h3, body > footer > nav h3 a { - text-transform: uppercase; - font-weight: normal; +.m-block.m-badge p { + margin-left: 5rem; + text-indent: 0; } -body > footer > nav ul { - list-style-type: none; - padding: 0; - margin: 0; +.m-block.m-badge img { + width: 4rem; + height: 4rem; + border-radius: 2rem; + float: left; } -body > footer > nav a { +div.m-button { + text-align: center; +} +div.m-button a { + display: inline-block; + border-radius: 0.2rem; + padding-top: 0.75rem; + padding-bottom: 0.75rem; + padding-left: 1.5rem; + padding-right: 1.5rem; text-decoration: none; - text-transform: none; - color: #ffffff; + font-size: 1.17rem; } -body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { - color: #a5c9ea; +div.m-button.m-fullwidth a { + display: block; + padding-left: 0.5rem; + padding-right: 0.5rem; } -body > main { - padding-top: 1rem; - padding-bottom: 1rem; +div.m-button a .m-big:first-child { + font-size: 1.37rem; + font-weight: bold; } -article h1 { - font-size: 1.75rem; +div.m-button a .m-small:last-child { + font-size: 0.854rem; } -article h1 .m-breadcrumb { - color: #747474; +.m-label { + border-radius: 0.2rem; + font-size: 75%; font-weight: normal; + padding: 0.125rem 0.25rem; + vertical-align: 7.5%; } -article h1 .m-breadcrumb a { - color: #a5c9ea; +.m-label.m-flat { + border-width: 0.0625rem; + border-style: solid; + border-color: #747474; + padding: 0.0625rem 0.1875rem; } -article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { - color: #dcdcdc; +table.m-table { + border-collapse: collapse; + margin-left: auto; + margin-right: auto; } -article > header h1 { - font-size: 2rem; - margin-bottom: 0.5rem; +table.m-table.m-big { + margin-top: 1.75rem; } -article h1 a, article > header h1, article > header h1 a, -article section > h2, article section > h2 a, -article section > h3, article section > h3 a, -article section > h4, article section > h4 a, -article section > h5, article section > h5 a, -article section > h6, article section > h6 a { - color: #a5c9ea; +div.m-scroll > table.m-table:last-child { + margin-bottom: 0.0625rem; } -article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, -article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, -article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, -article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, -article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, -article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { - color: #dcdcdc; +table.m-table:not(.m-flat) tbody tr:hover { + background-color: #405363; } -article > header .m-date { - display: block; - width: 2.5rem; - float: left; - text-align: center; - line-height: 95%; - font-size: 0.75rem; - font-weight: normal; - white-space: nowrap; - border-right-style: solid; - border-right-width: 0.125rem; - border-color: #a5c9ea; - padding-right: 0.75rem; - margin-top: -0.1rem; - margin-right: 0.75rem; - margin-bottom: 0.25rem; +table.m-table th, table.m-table td { + vertical-align: top; + border-style: solid; + border-top-width: 0.0625rem; + border-left-width: 0; + border-right-width: 0; + border-bottom-width: 0; + border-color: #405363; } -article > header .m-date-day { - display: block; - font-weight: bold; - padding-top: 0.2rem; - padding-bottom: 0.15rem; - font-size: 1.25rem; +table.m-table caption { + padding-bottom: 0.5rem; } -article > header p { - color: #f0f0f0; - font-size: 1.125rem; +table.m-table thead tr:first-child th, table.m-table thead tr:first-child td { + border-top-width: 0.125rem; } -article > header h1::after { - content: " "; - clear: both; - display: table; +table.m-table thead th, table.m-table thead td { + border-bottom-width: 0.125rem; + vertical-align: bottom; } -article > footer { - color: #c5c5c5; +table.m-table tfoot th, table.m-table tfoot td { + border-top-width: 0.125rem; } -article > footer p { - font-style: italic; - font-size: 0.85rem; - text-indent: 0; +table.m-table th, table.m-table td { + padding: 0.5rem; } -article section:target { - margin-left: -1.0rem; - border-left-style: solid; - border-left-width: 0.25rem; - padding-left: 0.75rem; - border-color: #a5c9ea; +table.m-table.m-big th, table.m-table.m-big td { + padding: 0.75rem 1rem; } -article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, -article section > h4 a, article section > h5 a, article section > h6 a { - text-decoration: none; +table.m-table th { + text-align: left; } -#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { - background-size: cover; - background-color: #0f1217; - background-position: center center; - background-repeat: no-repeat; - margin-top: -4rem; - padding-top: 5rem; +table.m-table th.m-thin { + font-weight: normal; } -#m-landing-image { - color: #ffffff; +table.m-table td.m-default, table.m-table th.m-default, +table.m-table td.m-primary, table.m-table th.m-primary, +table.m-table td.m-success, table.m-table th.m-success, +table.m-table td.m-warning, table.m-table th.m-warning, +table.m-table td.m-danger, table.m-table th.m-danger, +table.m-table td.m-info, table.m-table th.m-info, +table.m-table td.m-dim, table.m-table th.m-dim { + padding-left: 0.4375rem; + padding-right: 0.4375rem; + border-left-width: 0.0625rem; } -#m-cover-image { - height: 30rem; - margin-bottom: -26rem; +table.m-table.m-big td.m-default, table.m-table.m-big th.m-default, +table.m-table.m-big td.m-primary, table.m-table.m-big th.m-primary, +table.m-table.m-big td.m-success, table.m-table.m-big th.m-success, +table.m-table.m-big td.m-warning, table.m-table.m-big th.m-warning, +table.m-table.m-big td.m-danger, table.m-table.m-big th.m-danger, +table.m-table.m-big td.m-info, table.m-table.m-big th.m-info, +table.m-table.m-big td.m-dim, table.m-table.m-big th.m-dim { + padding-left: 0.9375rem; + padding-right: 0.9375rem; + border-left-width: 0.0625rem; } -#m-landing-cover h1 { - font-size: 2.8rem; - margin-top: -0.5rem; - padding-left: 1.5rem; - padding-bottom: 1rem; - text-transform: lowercase; +table.m-table tr.m-default td, table.m-table td.m-default, +table.m-table tr.m-default th, table.m-table th.m-default, +table.m-table tr.m-primary td, table.m-table td.m-primary, +table.m-table tr.m-primary th, table.m-table th.m-primary, +table.m-table tr.m-success td, table.m-table td.m-success, +table.m-table tr.m-success th, table.m-table th.m-success, +table.m-table tr.m-warning td, table.m-table td.m-warning, +table.m-table tr.m-warning th, table.m-table th.m-warning, +table.m-table tr.m-danger td, table.m-table td.m-danger, +table.m-table tr.m-danger th, table.m-table th.m-danger, +table.m-table tr.m-info td, table.m-table td.m-info, +table.m-table tr.m-info th, table.m-table th.m-info, +table.m-table tr.m-dim td, table.m-table td.m-dim, +table.m-table tr.m-dim th, table.m-table th.m-dim { + border-color: #2f363f; } -#m-landing-cover { - padding-bottom: 10rem; - margin-bottom: -6rem; +.m-block.m-default { border-left-color: #405363; } +.m-block.m-default h3, .m-block.m-default h4, .m-block.m-default h5, .m-block.m-default h6 { + color: #dcdcdc; } -article#m-jumbo { - margin-top: -1rem; +.m-block.m-primary { border-left-color: #a5c9ea; } +.m-block.m-primary h3, .m-block.m-primary h4, .m-block.m-primary h5, .m-block.m-primary h6 { + color: #a5c9ea; } -#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { - background: linear-gradient(transparent 0%, transparent 50%, #2f363f 100%); - width: 100%; - height: 100%; +.m-block.m-success { border-left-color: #3bd267; } +.m-block.m-success h3, .m-block.m-success h4, .m-block.m-success h5, .m-block.m-success h6 { + color: #3bd267; } -article#m-jumbo > header h1, article#m-jumbo > header h2 { - text-align: center; - font-weight: bold; +.m-block.m-warning { border-left-color: #c7cf2f; } +.m-block.m-warning h3, .m-block.m-warning h4, .m-block.m-warning h5, .m-block.m-warning h6 { + color: #c7cf2f; } -article#m-jumbo > header a { - text-decoration: none; +.m-block.m-danger { border-left-color: #cd3431; } +.m-block.m-danger h3, .m-block.m-danger h4, .m-block.m-danger h5, .m-block.m-danger h6 { + color: #cd3431; } -article#m-jumbo > header #m-jumbo-cover { - padding-bottom: 5rem; +.m-block.m-info { border-left-color: #2f83cc; } +.m-block.m-info h3, .m-block.m-info h4, .m-block.m-info h5, .m-block.m-info h6 { + color: #2f83cc; } -article#m-jumbo > header #m-jumbo-image { - font-size: 2.5vmin; - margin-bottom: -3rem; +.m-block.m-dim { + border-left-color: #747474; + color: #747474; } -article#m-jumbo > header h1 { - font-size: 10vmin; +.m-block.m-dim a { color: #acacac; } +.m-block.m-dim a:hover, .m-block.m-dim a:focus, .m-block.m-dim a:active { + color: #747474; } -article#m-jumbo > header h2 { - font-size: 3vmin; +.m-block.m-flat { border-color: transparent; } +.m-block.m-flat h3, .m-block.m-flat h4, .m-block.m-flat h5. .m-block.m-flat h6 { + color: #dcdcdc; } -@media screen and (max-height: 640px) , screen and (max-width: 640px) { - article#m-jumbo > header h1 { - font-size: 3rem; - } - article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { - font-size: 1rem; - } +.m-note.m-default { background-color: #34424d; } +.m-note.m-default, +table.m-table tr.m-default td, table.m-table td.m-default, +table.m-table tr.m-default th, table.m-table th.m-default { + color: #dcdcdc; } -article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { - color: #ffffff; +.m-note.m-default a:hover, +table.m-table tr.m-default td a:hover, table.m-table td.m-default a:hover, +table.m-table tr.m-default th a:hover, table.m-table th.m-default a:hover, +.m-note.m-default a:focus, +table.m-table tr.m-default td a:focus, table.m-table td.m-default a:focus, +table.m-table tr.m-default th a:focus, table.m-table th.m-default a:focus, +.m-note.m-default a:active, +table.m-table tr.m-default td a:active, table.m-table td.m-default a:active, +table.m-table tr.m-default th a:active, table.m-table th.m-default a:active { + color: #a5c9ea; } -article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { - color: #f0f0f0; +.m-note.m-primary a, +table.m-table tr.m-primary td a, table.m-table td.m-primary a, +table.m-table tr.m-primary th a, table.m-table th.m-primary a { + color: #5b9dd9; } -article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { - color: #000000; +.m-note.m-primary, +table.m-table tr.m-primary td, table.m-table td.m-primary, +table.m-table tr.m-primary th, table.m-table th.m-primary { + background-color: #a5c2db; + color: #2f363f; } -article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { - color: #0f0f0f; +.m-note.m-primary a, +table.m-table tr.m-primary td a, table.m-table td.m-primary a, +table.m-table tr.m-primary th a, table.m-table th.m-primary a { + color: #2a75b6; } -.m-landing-news h3 a { - color: #dcdcdc; - text-decoration: none; - text-transform: uppercase; +.m-note.m-primary a:hover, +table.m-table tr.m-primary td a:hover, table.m-table td.m-primary a:hover, +table.m-table tr.m-primary th a:hover, table.m-table th.m-primary a:hover, +.m-note.m-primary a:focus, +table.m-table tr.m-primary td a:focus, table.m-table td.m-primary a:focus, +table.m-table tr.m-primary th a:focus, table.m-table th.m-primary a:focus, +.m-note.m-primary a:active, +table.m-table tr.m-primary td a:active, table.m-table td.m-primary a:active, +table.m-table tr.m-primary th a:active, table.m-table th.m-primary a:active { + color: #2f363f; } -.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { - color: #a5c9ea; +.m-note.m-success, +table.m-table tr.m-success td, table.m-table td.m-success, +table.m-table tr.m-success th, table.m-table th.m-success { + background-color: #2a703f; + color: #acecbe; } -.m-landing-news time { - display: inline-block; - margin-left: 1rem; - float: right; +.m-note.m-success a, +table.m-table tr.m-success td a, table.m-table td.m-success a, +table.m-table tr.m-success th a, table.m-table th.m-success a { + color: #3bd267; } -.m-article-pagination { - text-align: center; - padding: 1rem; +.m-note.m-success a:hover, +table.m-table tr.m-success td a:hover, table.m-table td.m-success a:hover, +table.m-table tr.m-success th a:hover, table.m-table th.m-success a:hover, +.m-note.m-success a:focus, +table.m-table tr.m-success td a:focus, table.m-table td.m-success a:focus, +table.m-table tr.m-success th a:focus, table.m-table th.m-success a:focus, +.m-note.m-success a:active, +table.m-table tr.m-success td a:active, table.m-table td.m-success a:active, +table.m-table tr.m-success th a:active, table.m-table th.m-success a:active { + color: #acecbe; } -nav.m-navpanel { - text-align: center; +.m-note.m-warning, table.m-table tr.m-warning td, table.m-table td.m-warning, + table.m-table tr.m-warning th, table.m-table th.m-warning { + background-color: #6d702a; + color: #e9ecae; } -nav.m-navpanel h3 { - text-transform: uppercase; - font-weight: normal; +.m-note.m-warning a, table.m-table tr.m-warning td a, table.m-table td.m-warning a, + table.m-table tr.m-warning th a, table.m-table th.m-warning a { + color: #b8bf2b; } -nav.m-navpanel ol { - text-transform: lowercase; +.m-note.m-warning a:hover, +table.m-table tr.m-warning td a:hover, table.m-table td.m-warning a:hover, +table.m-table tr.m-warning th a:hover, table.m-table th.m-warning a:hover, +.m-note.m-warning a:focus, +table.m-table tr.m-warning td a:focus, table.m-table td.m-warning a:focus, +table.m-table tr.m-warning th a:focus, table.m-table th.m-warning a:focus, +.m-note.m-warning a:active, +table.m-table tr.m-warning td a:active, table.m-table td.m-warning a:active, +table.m-table tr.m-warning th a:active, table.m-table th.m-warning a:active { + color: #e9ecae; } -nav.m-navpanel ol, nav.m-navpanel ul { - list-style-type: none; - padding: 0; +.m-note.m-danger, +table.m-table tr.m-danger td, table.m-table td.m-danger, +table.m-table tr.m-danger th, table.m-table th.m-danger { + background-color: #702b2a; + color: #ff9391; } -nav.m-navpanel a { - color: #ffffff; - text-decoration: none; +.m-note.m-danger a, +table.m-table tr.m-danger td a, table.m-table td.m-danger a, +table.m-table tr.m-danger th a, table.m-table th.m-danger a { + color: #d85c59; } -nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { - color: #a5c9ea; +.m-note.m-danger a:hover, +table.m-table tr.m-danger td a:hover, table.m-table td.m-danger a:hover, +table.m-table tr.m-danger th a:hover, table.m-table th.m-danger a:hover, +.m-note.m-danger a:focus, +table.m-table tr.m-danger td a:focus, table.m-table td.m-danger a:focus, +table.m-table tr.m-danger th a:focus, table.m-table th.m-danger a:focus, +.m-note.m-danger a:active, +table.m-table tr.m-danger td a:active, table.m-table td.m-danger a:active, +table.m-table tr.m-danger th a:active, table.m-table th.m-danger a:active { + color: #ff9391; } -ul.m-tagcloud li { display: inline; } -ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } -ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } -ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } -ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } -ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } -div.m-scroll { - max-width: 100%; - overflow-x: auto; +.m-note.m-info, +table.m-table tr.m-info td, table.m-table td.m-info, +table.m-table tr.m-info th, table.m-table th.m-info { + background-color: #2a4f70; + color: #a5caeb; } -.m-fullwidth { - width: 100%; +.m-note.m-info a, +table.m-table tr.m-info td a, table.m-table td.m-info a, +table.m-table tr.m-info th a, table.m-table th.m-info a { + color: #5297d7; } -.m-text-center, .m-text-center.m-noindent, table.m-table th.m-text-center, .m-text-center p { - text-align: center; +.m-note.m-info a:hover, +table.m-table tr.m-info td a:hover, table.m-table td.m-info a:hover, +table.m-table tr.m-info th a:hover, table.m-table th.m-info a:hover, +.m-note.m-info a:focus, +table.m-table tr.m-info td a:focus, table.m-table td.m-info a:focus, +table.m-table tr.m-info th a:focus, table.m-table th.m-info a:focus, +.m-note.m-info a:active, +table.m-table tr.m-info td a:active, table.m-table td.m-info a:active, +table.m-table tr.m-info th a:active, table.m-table th.m-info a:active { + color: #a5caeb; } -.m-text-left, .m-text-left.m-noindent, table.m-table th.m-text-left, .m-text-right p { - text-align: left; +.m-note.m-dim, +table.m-table tr.m-dim td, table.m-table td.m-dim, +table.m-table tr.m-dim th, table.m-table th.m-dim { + background-color: #2d3236; + color: #747474; } -.m-text-right, .m-text-right.m-noindent, table.m-table th.m-text-right, .m-text-right p { - text-align: right; +.m-note.m-dim a, +table.m-table tr.m-dim td a, table.m-table td.m-dim a, +table.m-table tr.m-dim th a, table.m-table th.m-dim a { + color: #acacac; } -.m-text-top, table.m-table th.m-text-top, table.m-table td.m-text-top { - vertical-align: top; +.m-note.m-dim a:hover, +table.m-table tr.m-dim td a:hover, table.m-table td.m-dim a:hover, +table.m-table tr.m-dim th a:hover, table.m-table th.m-dim a:hover, +.m-note.m-dim a:focus, +table.m-table tr.m-dim td a:focus, table.m-table td.m-dim a:focus, +table.m-table tr.m-dim th a:focus, table.m-table th.m-dim a:focus, +.m-note.m-dim a:active, +table.m-table tr.m-dim td a:active, table.m-table td.m-dim a:active, +table.m-table tr.m-dim th a:active, table.m-table th.m-dim a:active { + color: #747474; } -.m-text-middle, table.m-table th.m-text-middle, table.m-table td.m-text-middle { - vertical-align: middle; +.m-text.m-default, .m-label.m-flat.m-default { color: #dcdcdc; } +.m-text.m-primary, .m-label.m-flat.m-primary { color: #a5c9ea; } +.m-text.m-success, .m-label.m-flat.m-success { color: #3bd267; } +.m-text.m-warning, .m-label.m-flat.m-warning { color: #c7cf2f; } +.m-text.m-danger, .m-label.m-flat.m-danger { color: #cd3431; } +.m-text.m-info, .m-label.m-flat.m-info { color: #2f83cc; } +.m-text.m-dim, .m-label.m-flat.m-dim { color: #747474; } +.m-text.m-dim a { color: #acacac; } +.m-text.m-dim a:hover, .m-text.m-dim a:focus, .m-text.m-dim a:active { + color: #747474; } -.m-text-bottom, table.m-table th.m-text-bottom, table.m-table td.m-text-bottom { - vertical-align: bottom; +div.m-button a, .m-label { color: #22272e; } +div.m-button.m-flat a { color: #dcdcdc; } +div.m-button.m-flat a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { + color: #a5c9ea; } -.m-text.m-small { - font-size: 85.4%; +div.m-button.m-default a, .m-label:not(.m-flat).m-default { background-color: #dcdcdc; } +div.m-button.m-primary a, .m-label:not(.m-flat).m-primary { background-color: #a5c9ea; } +div.m-button.m-success a, .m-label:not(.m-flat).m-success { background-color: #3bd267; } +div.m-button.m-warning a, .m-label:not(.m-flat).m-warning { background-color: #c7cf2f; } +div.m-button.m-danger a, .m-label:not(.m-flat).m-danger { background-color: #cd3431; } +div.m-button.m-info a, .m-label:not(.m-flat).m-info { background-color: #2f83cc; } +div.m-button.m-dim a, .m-label:not(.m-flat).m-dim { background-color: #747474; } +div.m-button.m-default a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { + background-color: #a5c9ea; } -.m-text.m-big { - font-size: 117%; +div.m-button.m-primary a:hover, div.m-button.m-primary a:focus, div.m-button.m-primary a:active { + background-color: #dcdcdc; } -.m-text.m-strong { - font-weight: bold; +div.m-button.m-success a:hover, div.m-button.m-success a:focus, div.m-button.m-success a:active { + background-color: #acecbe; } -.m-text.m-em { - font-style: italic; +div.m-button.m-warning a:hover, div.m-button.m-warning a:focus, div.m-button.m-warning a:active { + background-color: #e9ecae; } -h1 .m-thin, h2 .m-thin, h3 .m-thin, h4 .m-thin, h5 .m-thin, h6 .m-thin { - font-weight: normal; +div.m-button.m-danger a:hover, div.m-button.m-danger a:focus, div.m-button.m-danger a:active { + background-color: #ff9391; } -ul.m-unstyled, ol.m-unstyled { - list-style-type: none; - padding-left: 0; +div.m-button.m-info a:hover, div.m-button.m-info a:focus, div.m-button.m-info a:active { + background-color: #5297d7; } -ul[class*='m-block-'], ol[class*='m-block-'] { - padding-left: 0; +div.m-button.m-dim a:hover, div.m-button.m-dim a:focus, div.m-button.m-dim a:active { + background-color: #acacac; } -ul[class*='m-block-'] li, ol[class*='m-block-'] li { - display: inline; +img.m-image, svg.m-image { + display: block; + margin-left: auto; + margin-right: auto; } -ul[class*='m-block-bar-'] li:not(:last-child)::after, ol[class*='m-block-bar-'] li:not(:last-child)::after { - content: " | "; +div.m-image { + text-align: center; } -@media screen and (min-width: 576px) { - ul.m-block-bar-s, ol.m-block-bar-s { padding-left: 2rem; } - ul.m-block-bar-s li, ol.m-block-bar-s li { display: list-item; } - ul.m-block-bar-s li:not(:last-child)::after, ol.m-block-bar-s li:not(:last-child)::after { content: ""; } -} -@media screen and (min-width: 768px) { - ul.m-block-bar-m, ol.m-block-bar-m { padding-left: 2rem; } - ul.m-block-bar-m li, ol.m-block-bar-m li { display: list-item; } - ul.m-block-bar-m li:not(:last-child)::after, ol.m-block-bar-m li:not(:last-child)::after { content: ""; } -} -@media screen and (min-width: 992px) { - ul.m-block-bar-l, ol.m-block-bar-l { padding-left: 2rem; } - ul.m-block-bar-l li, ol.m-block-bar-l li { display: list-item; } - ul.m-block-bar-l li:not(:last-child)::after, ol.m-block-bar-l li:not(:last-child)::after { content: ""; } -} -p.m-poem { - text-indent: 0; - text-align: left; - margin-left: 1.5rem; -} -p.m-transition { - color: #405363; - text-indent: 0; - text-align: center; - font-size: 2rem; -} -dl.m-diary { - margin-bottom: 1.25rem; -} -dl.m-diary:last-child { - margin-bottom: 0.25rem; -} -dl.m-diary dt { - font-weight: bold; - width: 3.5rem; - float: left; - clear: both; - padding-top: 0.25rem; -} -dl.m-diary dd { - padding-top: 0.25rem; - padding-left: 3.5rem; -} -.m-note { +img.m-image, svg.m-image, div.m-image img { + max-width: 100%; border-radius: 0.2rem; - padding: 1rem; } -.m-note pre, .m-note code { - background-color: rgba(34, 39, 46, 0.5); +div.m-image.m-fullwidth img, div.m-image.m-fullwidth svg { + width: 100%; } -.m-frame { - background-color: #2f363f; +figure.m-figure { + max-width: 100%; + margin-top: 0; + margin-left: auto; + margin-right: auto; + position: relative; + display: table; +} +figure.m-figure:before { + position: absolute; + content: ' '; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: -1; border-style: solid; border-width: 0.125rem; border-radius: 0.2rem; border-color: #405363; - padding: 0.875rem; } -.m-block { - border-style: solid; - border-width: 0.0625rem; - border-left-width: 0.25rem; - border-radius: 0.2rem; - border-color: #405363; - padding: 0.9375rem 0.9375rem 0.9375rem 0.75rem; +figure.m-figure.m-flat:before { + border-color: transparent; } -.m-block.m-badge::after { - content: ' '; - display: block; - clear: both; +figure.m-figure > * { + margin-left: 1rem; + margin-right: 1rem; + display: table-caption; + caption-side: bottom; } -.m-block.m-badge h3 { - margin-left: 5rem; +figure.m-figure > *:first-child { + display: inline; } -.m-block.m-badge p { - margin-left: 5rem; - text-indent: 0; +figure.m-figure > *:last-child { + margin-bottom: 1rem; } -.m-block.m-badge img { - width: 4rem; - height: 4rem; - border-radius: 2rem; - float: left; +figure.m-figure img { + position: relative; + margin-left: 0; + margin-right: 0; + margin-bottom: 0; + border-top-left-radius: 0.2rem; + border-top-right-radius: 0.2rem; + max-width: 100%; } -div.m-button { - text-align: center; +figure.m-figure.m-flat img { + border-bottom-left-radius: 0.2rem; + border-bottom-right-radius: 0.2rem; } -div.m-button a { - display: inline-block; - border-radius: 0.2rem; - padding-top: 0.75rem; - padding-bottom: 0.75rem; - padding-left: 1.5rem; - padding-right: 1.5rem; - text-decoration: none; +figure.m-figure figcaption { + margin-top: 0.5rem; + margin-bottom: 0.5rem; + font-weight: bold; font-size: 1.17rem; } -div.m-button.m-fullwidth a { - display: block; - padding-left: 0.5rem; - padding-right: 0.5rem; +figure.m-figure a img { + margin-left: -1rem; + margin-right: -1rem; } -div.m-button a .m-big:first-child { - font-size: 1.37rem; - font-weight: bold; +figure.m-figure.m-fullwidth, figure.m-figure.m-fullwidth > * { + display: block; } -div.m-button a .m-small:last-child { - font-size: 0.854rem; +figure.m-figure.m-fullwidth > *:first-child { + display: inline; } -.m-label { - border-radius: 0.2rem; - font-size: 75%; - font-weight: normal; - padding: 0.125rem 0.25rem; - vertical-align: 7.5%; +figure.m-figure.m-fullwidth img { + width: 100%; } -.m-label.m-flat { - border-width: 0.0625rem; - border-style: solid; - border-color: #747474; - padding: 0.0625rem 0.1875rem; +figure.m-figure.m-fullwidth:after { + content: ' '; + display: block; + margin-top: 1rem; + height: 1px; } -table.m-table { - border-collapse: collapse; - margin-left: auto; - margin-right: auto; +figure.m-code-figure, figure.m-console-figure { + margin-top: 0; + margin-left: 0; + margin-right: 0; + position: relative; + padding: 1rem; } -table.m-table.m-big { - margin-top: 1.75rem; +figure.m-code-figure:before, figure.m-console-figure:before { + position: absolute; + content: ' '; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: -1; + border-style: solid; + border-width: 0.125rem; + border-radius: 0.2rem; } -div.m-scroll > table.m-table:last-child { - margin-bottom: 0.0625rem; +figure.m-code-figure:before { + border-color: #282e36; } -table.m-table:not(.m-flat) tbody tr:hover { - background-color: #405363; +figure.m-console-figure:before { + border-color: #000000; } -table.m-table th, table.m-table td { - vertical-align: top; - border-style: solid; - border-top-width: 0.0625rem; - border-left-width: 0; - border-right-width: 0; - border-bottom-width: 0; - border-color: #405363; +figure.m-code-figure.m-flat:before, figure.m-console-figure.m-flat:before { + border-color: transparent; } -table.m-table caption { - padding-bottom: 0.5rem; +figure.m-code-figure > pre:first-child, figure.m-console-figure > pre:first-child { + position: relative; + margin: -1rem -1rem 1rem -1rem; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; } -table.m-table thead tr:first-child th, table.m-table thead tr:first-child td { - border-top-width: 0.125rem; +figure.m-figure.m-default:before { border-color: #34424d; } +figure.m-figure.m-default figcaption { color: #dcdcdc; } +figure.m-figure.m-primary:before { border-color: #a5c2db; } +figure.m-figure.m-primary figcaption { color: #a5c9ea; } +figure.m-figure.m-success:before { border-color: #2a703f; } +figure.m-figure.m-success figcaption { color: #3bd267; } +figure.m-figure.m-warning:before { border-color: #6d702a; } +figure.m-figure.m-warning figcaption { color: #c7cf2f; } +figure.m-figure.m-danger:before { border-color: #702b2a; } +figure.m-figure.m-danger figcaption { color: #cd3431; } +figure.m-figure.m-info:before { border-color: #2a4f70; } +figure.m-figure.m-info figcaption { color: #2f83cc; } +figure.m-figure.m-dim:before { border-color: #2d3236; } +figure.m-figure.m-dim { color: #747474; } +figure.m-figure.m-dim a { color: #acacac; } +figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m-dim a:active { + color: #747474; } -table.m-table thead th, table.m-table thead td { - border-bottom-width: 0.125rem; - vertical-align: bottom; +.m-imagegrid > div { + background-color: #2f363f; /* to avoid section HL shining through */ } -table.m-table tfoot th, table.m-table tfoot td { - border-top-width: 0.125rem; +.m-imagegrid > div > figure { + display: block; + float: left; + position: relative; + margin: 0; } -table.m-table th, table.m-table td { +.m-imagegrid > div > figure > div, +.m-imagegrid > div > figure > figcaption, +.m-imagegrid > div > figure > a > div, +.m-imagegrid > div > figure > a > figcaption { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + border-color: #2f363f; + border-style: solid; + border-width: 0.25rem; padding: 0.5rem; } -table.m-table.m-big th, table.m-table.m-big td { - padding: 0.75rem 1rem; +.m-imagegrid > div > figure:first-child > div, +.m-imagegrid > div > figure:first-child > figcaption, +.m-imagegrid > div > figure:first-child > a > div, +.m-imagegrid > div > figure:first-child > a > figcaption { + border-left-width: 0; } -table.m-table th { - text-align: left; +.m-imagegrid > div > figure:last-child > div, +.m-imagegrid > div > figure:last-child > figcaption, +.m-imagegrid > div > figure:last-child > a > div, +.m-imagegrid > div > figure:last-child > a > figcaption { + border-right-width: 0; } -table.m-table th.m-thin { - font-weight: normal; +.m-imagegrid > div > figure > figcaption, +.m-imagegrid > div > figure > a > figcaption { + color: transparent; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-size: 0.75rem; } -table.m-table td.m-default, table.m-table th.m-default, -table.m-table td.m-primary, table.m-table th.m-primary, -table.m-table td.m-success, table.m-table th.m-success, -table.m-table td.m-warning, table.m-table th.m-warning, -table.m-table td.m-danger, table.m-table th.m-danger, -table.m-table td.m-info, table.m-table th.m-info, -table.m-table td.m-dim, table.m-table th.m-dim { - padding-left: 0.4375rem; - padding-right: 0.4375rem; - border-left-width: 0.0625rem; +.m-imagegrid > div > figure > div::before, +.m-imagegrid > div > figure > figcaption::before, +.m-imagegrid > div > figure > a > div::before, +.m-imagegrid > div > figure > a > figcaption::before { + content: ''; + display: inline-block; + height: 100%; + vertical-align: bottom; + width: 0; } -table.m-table.m-big td.m-default, table.m-table.m-big th.m-default, -table.m-table.m-big td.m-primary, table.m-table.m-big th.m-primary, -table.m-table.m-big td.m-success, table.m-table.m-big th.m-success, -table.m-table.m-big td.m-warning, table.m-table.m-big th.m-warning, -table.m-table.m-big td.m-danger, table.m-table.m-big th.m-danger, -table.m-table.m-big td.m-info, table.m-table.m-big th.m-info, -table.m-table.m-big td.m-dim, table.m-table.m-big th.m-dim { - padding-left: 0.9375rem; - padding-right: 0.9375rem; - border-left-width: 0.0625rem; +.m-imagegrid > div > figure:hover > figcaption, +.m-imagegrid > div > figure:hover > a > figcaption { + background: linear-gradient(transparent 0%, transparent 75%, rgba(0, 0, 0, 0.85) 100%); + color: #ffffff; } -table.m-table tr.m-default td, table.m-table td.m-default, -table.m-table tr.m-default th, table.m-table th.m-default, -table.m-table tr.m-primary td, table.m-table td.m-primary, -table.m-table tr.m-primary th, table.m-table th.m-primary, -table.m-table tr.m-success td, table.m-table td.m-success, -table.m-table tr.m-success th, table.m-table th.m-success, -table.m-table tr.m-warning td, table.m-table td.m-warning, -table.m-table tr.m-warning th, table.m-table th.m-warning, -table.m-table tr.m-danger td, table.m-table td.m-danger, -table.m-table tr.m-danger th, table.m-table th.m-danger, -table.m-table tr.m-info td, table.m-table td.m-info, -table.m-table tr.m-info th, table.m-table th.m-info, -table.m-table tr.m-dim td, table.m-table td.m-dim, -table.m-table tr.m-dim th, table.m-table th.m-dim { - border-color: #2f363f; +.m-imagegrid > div > figure > img, +.m-imagegrid > div > figure > a > img { + width: 100%; + height: 100%; } -.m-block.m-default { border-left-color: #405363; } -.m-block.m-default h3, .m-block.m-default h4, .m-block.m-default h5, .m-block.m-default h6 { - color: #dcdcdc; +.m-imagegrid > div::after { + display: block; + content: ' '; + clear: both; } -.m-block.m-primary { border-left-color: #a5c9ea; } -.m-block.m-primary h3, .m-block.m-primary h4, .m-block.m-primary h5, .m-block.m-primary h6 { - color: #a5c9ea; +@media screen and (max-width: 767px) { + .m-imagegrid > div > figure { + float: none; + width: 100% !important; + } + .m-imagegrid > div > figure > div, + .m-imagegrid > div > figure > figcaption, + .m-imagegrid > div > figure > a > div, + .m-imagegrid > div > figure > a > figcaption { + border-left-width: 0; + border-right-width: 0; + } } -.m-block.m-success { border-left-color: #3bd267; } -.m-block.m-success h3, .m-block.m-success h4, .m-block.m-success h5, .m-block.m-success h6 { - color: #3bd267; +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-note, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-frame, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-block, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-imagegrid, +.m-container-inflatable > .m-row > [class*='m-col-'] > pre, +.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-code-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-console-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-note, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-frame, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-block, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-imagegrid, +.m-container-inflatable > .m-row > [class*='m-col-'] section > pre, +.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-code-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-console-figure { + margin-left: -1rem; + margin-right: -1rem; } -.m-block.m-warning { border-left-color: #c7cf2f; } -.m-block.m-warning h3, .m-block.m-warning h4, .m-block.m-warning h5, .m-block.m-warning h6 { - color: #c7cf2f; +@media screen and (min-width: 576px) { + .m-container-inflatable > .m-row > .m-col-s-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-s-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-danger { border-left-color: #cd3431; } -.m-block.m-danger h3, .m-block.m-danger h4, .m-block.m-danger h5, .m-block.m-danger h6 { - color: #cd3431; +@media screen and (min-width: 768px) { + .m-container-inflatable > .m-row > .m-col-m-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-m-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-info { border-left-color: #2f83cc; } -.m-block.m-info h3, .m-block.m-info h4, .m-block.m-info h5, .m-block.m-info h6 { - color: #2f83cc; +@media screen and (min-width: 992px) { + .m-container-inflatable > .m-row > .m-col-l-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-l-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-dim { - border-left-color: #747474; - color: #747474; +pre.m-code span.hll { + margin-left: -1.0rem; + margin-right: -1.0rem; + padding-left: 1.0rem; } -.m-block.m-dim a { color: #acacac; } -.m-block.m-dim a:hover, .m-block.m-dim a:focus, .m-block.m-dim a:active { - color: #747474; +pre.m-code.m-inverted { + color: rgba(230, 230, 230, 0.33); } -.m-block.m-flat { border-color: transparent; } -.m-block.m-flat h3, .m-block.m-flat h4, .m-block.m-flat h5. .m-block.m-flat h6 { - color: #dcdcdc; +pre.m-code.m-inverted > span { + opacity: 0.3333; } -.m-note.m-default { background-color: #34424d; } -.m-note.m-default, -table.m-table tr.m-default td, table.m-table td.m-default, -table.m-table tr.m-default th, table.m-table th.m-default { +pre.m-code.m-inverted > span.hll { color: #dcdcdc; + opacity: 1; + background-color: transparent; + border-color: transparent; } -.m-note.m-default a:hover, -table.m-table tr.m-default td a:hover, table.m-table td.m-default a:hover, -table.m-table tr.m-default th a:hover, table.m-table th.m-default a:hover, -.m-note.m-default a:focus, -table.m-table tr.m-default td a:focus, table.m-table td.m-default a:focus, -table.m-table tr.m-default th a:focus, table.m-table th.m-default a:focus, -.m-note.m-default a:active, -table.m-table tr.m-default td a:active, table.m-table td.m-default a:active, -table.m-table tr.m-default th a:active, table.m-table th.m-default a:active { - color: #a5c9ea; +div.m-math { + overflow-x: auto; + overflow-y: hidden; + text-align: center; } -.m-note.m-primary a, -table.m-table tr.m-primary td a, table.m-table td.m-primary a, -table.m-table tr.m-primary th a, table.m-table th.m-primary a { - color: #5b9dd9; +div.m-plot svg { + text-align: center; } -.m-note.m-primary, -table.m-table tr.m-primary td, table.m-table td.m-primary, -table.m-table tr.m-primary th, table.m-table th.m-primary { - background-color: #a5c2db; - color: #2f363f; +div.m-plot .m-background { + fill: #34424d; } -.m-note.m-primary a, -table.m-table tr.m-primary td a, table.m-table td.m-primary a, -table.m-table tr.m-primary th a, table.m-table th.m-primary a { - color: #2a75b6; +div.m-plot svg .m-label { font-size: 11px; } +div.m-plot svg .m-title { font-size: 13px; } +div.m-plot svg .m-label, div.m-plot svg .m-title { fill: #dcdcdc; } +div.m-plot svg .m-line { + stroke: #dcdcdc; + stroke-width: 0.8; } -.m-note.m-primary a:hover, -table.m-table tr.m-primary td a:hover, table.m-table td.m-primary a:hover, -table.m-table tr.m-primary th a:hover, table.m-table th.m-primary a:hover, -.m-note.m-primary a:focus, -table.m-table tr.m-primary td a:focus, table.m-table td.m-primary a:focus, -table.m-table tr.m-primary th a:focus, table.m-table th.m-primary a:focus, -.m-note.m-primary a:active, -table.m-table tr.m-primary td a:active, table.m-table td.m-primary a:active, -table.m-table tr.m-primary th a:active, table.m-table th.m-primary a:active { - color: #2f363f; +div.m-plot svg .m-error { + stroke: #ffffff; + stroke-width: 1.5; } -.m-note.m-success, -table.m-table tr.m-success td, table.m-table td.m-success, -table.m-table tr.m-success th, table.m-table th.m-success { - background-color: #2a703f; - color: #acecbe; +div.m-plot svg .m-label.m-dim { fill: #747474; } +div.m-math svg, svg.m-math { fill: #dcdcdc; } +div.m-math.m-default svg, svg.m-math.m-default, div.m-plot svg .m-bar.m-default { + fill: #dcdcdc; } -.m-note.m-success a, -table.m-table tr.m-success td a, table.m-table td.m-success a, -table.m-table tr.m-success th a, table.m-table th.m-success a { - color: #3bd267; +div.m-math.m-primary svg, svg.m-math.m-primary, div.m-plot svg .m-bar.m-primary { + fill: #a5c9ea; } -.m-note.m-success a:hover, -table.m-table tr.m-success td a:hover, table.m-table td.m-success a:hover, -table.m-table tr.m-success th a:hover, table.m-table th.m-success a:hover, -.m-note.m-success a:focus, -table.m-table tr.m-success td a:focus, table.m-table td.m-success a:focus, -table.m-table tr.m-success th a:focus, table.m-table th.m-success a:focus, -.m-note.m-success a:active, -table.m-table tr.m-success td a:active, table.m-table td.m-success a:active, -table.m-table tr.m-success th a:active, table.m-table th.m-success a:active { - color: #acecbe; +div.m-math.m-success svg, svg.m-math.m-success, div.m-plot svg .m-bar.m-success { + fill: #3bd267; } -.m-note.m-warning, table.m-table tr.m-warning td, table.m-table td.m-warning, - table.m-table tr.m-warning th, table.m-table th.m-warning { - background-color: #6d702a; - color: #e9ecae; +div.m-math.m-warning svg, svg.m-math.m-warning, div.m-plot svg .m-bar.m-warning { + fill: #c7cf2f; } -.m-note.m-warning a, table.m-table tr.m-warning td a, table.m-table td.m-warning a, - table.m-table tr.m-warning th a, table.m-table th.m-warning a { - color: #b8bf2b; +div.m-math.m-danger svg, svg.m-math.m-danger, div.m-plot svg .m-bar.m-danger { + fill: #cd3431; } -.m-note.m-warning a:hover, -table.m-table tr.m-warning td a:hover, table.m-table td.m-warning a:hover, -table.m-table tr.m-warning th a:hover, table.m-table th.m-warning a:hover, -.m-note.m-warning a:focus, -table.m-table tr.m-warning td a:focus, table.m-table td.m-warning a:focus, -table.m-table tr.m-warning th a:focus, table.m-table th.m-warning a:focus, -.m-note.m-warning a:active, -table.m-table tr.m-warning td a:active, table.m-table td.m-warning a:active, -table.m-table tr.m-warning th a:active, table.m-table th.m-warning a:active { - color: #e9ecae; +div.m-math.m-info svg, svg.m-math.m-info, div.m-plot svg .m-bar.m-info { + fill: #2f83cc; } -.m-note.m-danger, -table.m-table tr.m-danger td, table.m-table td.m-danger, -table.m-table tr.m-danger th, table.m-table th.m-danger { - background-color: #702b2a; - color: #ff9391; +div.m-math.m-dim svg, svg.m-math.m-dim, div.m-plot svg .m-bar.m-dim { + fill: #747474; } -.m-note.m-danger a, -table.m-table tr.m-danger td a, table.m-table td.m-danger a, -table.m-table tr.m-danger th a, table.m-table th.m-danger a { - color: #d85c59; +p, ul, ol, dl, blockquote, pre, figure.m-code-figure, figure.m-console-figure, +hr, .m-note, .m-frame, .m-block, div.m-button, div.m-scroll, table.m-table, +div.m-image, img.m-image, svg.m-image, figure.m-figure, .m-imagegrid, div.m-math { + margin-bottom: 1rem; } -.m-note.m-danger a:hover, -table.m-table tr.m-danger td a:hover, table.m-table td.m-danger a:hover, -table.m-table tr.m-danger th a:hover, table.m-table th.m-danger a:hover, -.m-note.m-danger a:focus, -table.m-table tr.m-danger td a:focus, table.m-table td.m-danger a:focus, -table.m-table tr.m-danger th a:focus, table.m-table th.m-danger a:focus, -.m-note.m-danger a:active, -table.m-table tr.m-danger td a:active, table.m-table td.m-danger a:active, -table.m-table tr.m-danger th a:active, table.m-table th.m-danger a:active { - color: #ff9391; +p:last-child, ul:last-child, ol:last-child, dl:last-child, blockquote:last-child, +pre:last-child, figure.m-code-figure:last-child, figure.m-console-figure:last-child, +hr:last-child, .m-note:last-child, .m-frame:last-child, .m-block:last-child, +div.m-button:last-child, div.m-scroll:last-child, table.m-table:last-child, +img.m-image:last-child, svg.m-image:last-child, div.m-image:last-child, +figure.m-figure:last-child, .m-imagegrid:last-child, div.m-math:last-child { + margin-bottom: 0; } -.m-note.m-info, -table.m-table tr.m-info td, table.m-table td.m-info, -table.m-table tr.m-info th, table.m-table th.m-info { - background-color: #2a4f70; - color: #a5caeb; +li > p:last-child, li > blockquote:last-child, li > pre:last-child, +li > figure.m-code-figure:last-child, li > figure.m-console-figure:last-child, +li > .m-note:last-child, li > .m-frame:last-child, li > .m-block:last-child, +li > div.m-button:last-child, li > div.m-scroll:last-child, li > table.m-table:last-child, +li > img.m-image:last-child, li > svg.m-image:last-child, li > div.m-image:last-child, +li > figure.m-figure:last-child, li > div.m-math:last-child { + margin-bottom: 1rem; } -.m-note.m-info a, -table.m-table tr.m-info td a, table.m-table td.m-info a, -table.m-table tr.m-info th a, table.m-table th.m-info a { - color: #5297d7; +li:last-child > p:last-child, li:last-child > blockquote:last-child, li:last-child > pre:last-child, +li:last-child > figure.m-code-figure:last-child, li:last-child > figure.m-console-figure:last-child, +li:last-child > .m-note:last-child, li:last-child > .m-frame:last-child, li:last-child > .m-block:last-child, +li:last-child > div.m-button:last-child, li:last-child > div.m-scroll:last-child, +li:last-child > table.m-table:last-child, li:last-child > img.m-image:last-child, +li:last-child > svg.m-image:last-child, li:last-child > div.m-image:last-child, +li:last-child > figure.m-figure:last-child, li:last-child > div.m-math:last-child { + margin-bottom: 0; } -.m-note.m-info a:hover, -table.m-table tr.m-info td a:hover, table.m-table td.m-info a:hover, -table.m-table tr.m-info th a:hover, table.m-table th.m-info a:hover, -.m-note.m-info a:focus, -table.m-table tr.m-info td a:focus, table.m-table td.m-info a:focus, -table.m-table tr.m-info th a:focus, table.m-table th.m-info a:focus, -.m-note.m-info a:active, -table.m-table tr.m-info td a:active, table.m-table td.m-info a:active, -table.m-table tr.m-info th a:active, table.m-table th.m-info a:active { - color: #a5caeb; + +body > header > nav { + width: 100%; + background-color: #22272e; + min-height: 3rem; } -.m-note.m-dim, -table.m-table tr.m-dim td, table.m-table td.m-dim, -table.m-table tr.m-dim th, table.m-table th.m-dim { - background-color: #2d3236; - color: #747474; +body > header > nav.m-navbar-landing, +body > header > nav.m-navbar-cover { + background-color: transparent; + position: relative; } -.m-note.m-dim a, -table.m-table tr.m-dim td a, table.m-table td.m-dim a, -table.m-table tr.m-dim th a, table.m-table th.m-dim a { - color: #acacac; +body > header > nav.m-navbar-landing { + opacity: 0.8; } -.m-note.m-dim a:hover, -table.m-table tr.m-dim td a:hover, table.m-table td.m-dim a:hover, -table.m-table tr.m-dim th a:hover, table.m-table th.m-dim a:hover, -.m-note.m-dim a:focus, -table.m-table tr.m-dim td a:focus, table.m-table td.m-dim a:focus, -table.m-table tr.m-dim th a:focus, table.m-table th.m-dim a:focus, -.m-note.m-dim a:active, -table.m-table tr.m-dim td a:active, table.m-table td.m-dim a:active, -table.m-table tr.m-dim th a:active, table.m-table th.m-dim a:active { - color: #747474; +body > header > nav.m-navbar-cover { + background-color: rgba(34, 39, 46, 0.25); + opacity: 1; } -.m-text.m-default, .m-label.m-flat.m-default { color: #dcdcdc; } -.m-text.m-primary, .m-label.m-flat.m-primary { color: #a5c9ea; } -.m-text.m-success, .m-label.m-flat.m-success { color: #3bd267; } -.m-text.m-warning, .m-label.m-flat.m-warning { color: #c7cf2f; } -.m-text.m-danger, .m-label.m-flat.m-danger { color: #cd3431; } -.m-text.m-info, .m-label.m-flat.m-info { color: #2f83cc; } -.m-text.m-dim, .m-label.m-flat.m-dim { color: #747474; } -.m-text.m-dim a { color: #acacac; } -.m-text.m-dim a:hover, .m-text.m-dim a:focus, .m-text.m-dim a:active { - color: #747474; +body > header > nav.m-navbar-landing:hover, +body > header > nav.m-navbar-cover:hover { + background-color: rgba(34, 39, 46, 0.75); + opacity: 1; } -div.m-button a, .m-label { color: #22272e; } -div.m-button.m-flat a { color: #dcdcdc; } -div.m-button.m-flat a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { +body> header > nav.m-navbar-landing:target, +body> header > nav.m-navbar-cover:target { + background-color: #22272e; + opacity: 1; +} +body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { + visibility: hidden; +} +body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { + visibility: visible; +} +body > header > nav { + margin-left: auto; + margin-right: auto; + color: #ffffff; +} +body > header > nav a { + text-decoration: none; + text-transform: none; + display: inline-block; + vertical-align: middle; + line-height: 2.75rem; + color: #ffffff; +} +body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { + text-transform: uppercase; + font-weight: bold; + font-size: 1.125rem; + padding-left: 1rem; + padding-right: 1rem; +} +body > header > nav a#m-navbar-brand .m-thin { + font-weight: normal; +} +body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { + content:'\2630'; +} +body > header > nav #m-navbar-collapse { + padding-bottom: 1rem; +} +body > header > nav #m-navbar-collapse li { + border-style: solid; + border-color: transparent; + border-width: 0 0 0 0.25rem; + margin-left: -1rem; +} +body > header > nav #m-navbar-collapse li a { + border-style: solid; + border-color: transparent; + line-height: 1.5rem; + margin-left: -0.25rem; + padding-left: 0.75rem; + border-width: 0 0 0 0.25rem; + width: 100%; +} +body > header > nav #m-navbar-collapse li a#m-navbar-current { + color: #5b9dd9; + border-color: #5b9dd9; +} +body > header > nav ol { + list-style-type: none; + margin: 0; +} +body > header > nav ol ol { + padding-left: 1.5rem; +} +body > header > nav [class*='m-col-'] { + padding-top: 0; + padding-bottom: 0; +} +body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { color: #a5c9ea; } -div.m-button.m-default a, .m-label:not(.m-flat).m-default { background-color: #dcdcdc; } -div.m-button.m-primary a, .m-label:not(.m-flat).m-primary { background-color: #a5c9ea; } -div.m-button.m-success a, .m-label:not(.m-flat).m-success { background-color: #3bd267; } -div.m-button.m-warning a, .m-label:not(.m-flat).m-warning { background-color: #c7cf2f; } -div.m-button.m-danger a, .m-label:not(.m-flat).m-danger { background-color: #cd3431; } -div.m-button.m-info a, .m-label:not(.m-flat).m-info { background-color: #2f83cc; } -div.m-button.m-dim a, .m-label:not(.m-flat).m-dim { background-color: #747474; } -div.m-button.m-default a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { - background-color: #a5c9ea; +body > header > nav #m-navbar-collapse li:hover { + border-color: #a5c9ea; } -div.m-button.m-primary a:hover, div.m-button.m-primary a:focus, div.m-button.m-primary a:active { - background-color: #dcdcdc; +body > header > nav #m-navbar-collapse li a:hover, +body > header > nav #m-navbar-collapse li a:focus, +body > header > nav #m-navbar-collapse li a:active { + border-color: #a5c9ea; + background-color: #292f37; +} +body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { + background-color: rgba(41, 47, 55, 0.5); +} +body > header > nav #m-navbar-hide { + display: none; +} +body > header > nav:target #m-navbar-collapse { + display: block; +} +body > header > nav:target #m-navbar-show { + display: none; +} +body > header > nav:target #m-navbar-hide { + display: inline-block; +} +@media screen and (min-width: 768px) { + body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, + body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { + display: none; + } + body > header > nav #m-navbar-collapse li a { + line-height: 2.75rem; + } + body > header > nav a, body > header > nav #m-navbar-collapse li a { + margin-left: 0; + padding-left: 1rem; + padding-right: 1rem; + white-space: nowrap; + } + body > header > nav #m-navbar-collapse { + padding-bottom: 0; + } + body > header > nav #m-navbar-collapse li ol { + background-color: #22272e; + } + body > header > nav #m-navbar-collapse ol ol li { + margin-left: 0; + padding-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse ol ol li a { + padding-left: 0.75rem; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li { + margin-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li > a { + border-width: 0 0 0.25rem 0; + } + body > header > nav #m-navbar-collapse ol { + padding-left: 0; + padding-right: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { + float: left; + } + body > header > nav #m-navbar-collapse ol ol { + z-index: 99999; + position: absolute; + visibility: hidden; + } + body > header > nav #m-navbar-collapse li:hover ol { + visibility: visible; + } } -div.m-button.m-success a:hover, div.m-button.m-success a:focus, div.m-button.m-success a:active { - background-color: #acecbe; +body > footer { + width: 100%; } -div.m-button.m-warning a:hover, div.m-button.m-warning a:focus, div.m-button.m-warning a:active { - background-color: #e9ecae; +body > footer > nav { + padding-top: 1rem; + padding-bottom: 1rem; + font-size: 0.85rem; + text-align: center; + color: #c5c5c5; + background-color: #444e5c; } -div.m-button.m-danger a:hover, div.m-button.m-danger a:focus, div.m-button.m-danger a:active { - background-color: #ff9391; +body > footer > nav h3, body > footer > nav h3 a { + text-transform: uppercase; + font-weight: normal; } -div.m-button.m-info a:hover, div.m-button.m-info a:focus, div.m-button.m-info a:active { - background-color: #5297d7; +body > footer > nav ul { + list-style-type: none; + padding: 0; + margin: 0; } -div.m-button.m-dim a:hover, div.m-button.m-dim a:focus, div.m-button.m-dim a:active { - background-color: #acacac; +body > footer > nav a { + text-decoration: none; + text-transform: none; + color: #ffffff; } -img.m-image, svg.m-image { - display: block; - margin-left: auto; - margin-right: auto; +body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { + color: #a5c9ea; } -div.m-image { - text-align: center; +body > main { + padding-top: 1rem; + padding-bottom: 1rem; } -img.m-image, svg.m-image, div.m-image img { - max-width: 100%; - border-radius: 0.2rem; +article h1 { + font-size: 1.75rem; } -div.m-image.m-fullwidth img, div.m-image.m-fullwidth svg { - width: 100%; +article h1 .m-breadcrumb { + color: #747474; + font-weight: normal; } -figure.m-figure { - max-width: 100%; - margin-top: 0; - margin-left: auto; - margin-right: auto; - position: relative; - display: table; +article h1 .m-breadcrumb a { + color: #a5c9ea; } -figure.m-figure:before { - position: absolute; - content: ' '; - top: 0; - bottom: 0; - left: 0; - right: 0; - z-index: -1; - border-style: solid; - border-width: 0.125rem; - border-radius: 0.2rem; - border-color: #405363; +article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { + color: #dcdcdc; } -figure.m-figure.m-flat:before { - border-color: transparent; +article > header h1 { + font-size: 2rem; + margin-bottom: 0.5rem; } -figure.m-figure > * { - margin-left: 1rem; - margin-right: 1rem; - display: table-caption; - caption-side: bottom; +article h1 a, article > header h1, article > header h1 a, +article section > h2, article section > h2 a, +article section > h3, article section > h3 a, +article section > h4, article section > h4 a, +article section > h5, article section > h5 a, +article section > h6, article section > h6 a { + color: #a5c9ea; } -figure.m-figure > *:first-child { - display: inline; +article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, +article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, +article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, +article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, +article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, +article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { + color: #dcdcdc; } -figure.m-figure > *:last-child { - margin-bottom: 1rem; +article > header .m-date { + display: block; + width: 2.5rem; + float: left; + text-align: center; + line-height: 95%; + font-size: 0.75rem; + font-weight: normal; + white-space: nowrap; + border-right-style: solid; + border-right-width: 0.125rem; + border-color: #a5c9ea; + padding-right: 0.75rem; + margin-top: -0.1rem; + margin-right: 0.75rem; + margin-bottom: 0.25rem; } -figure.m-figure img { - position: relative; - margin-left: 0; - margin-right: 0; - margin-bottom: 0; - border-top-left-radius: 0.2rem; - border-top-right-radius: 0.2rem; - max-width: 100%; +article > header .m-date-day { + display: block; + font-weight: bold; + padding-top: 0.2rem; + padding-bottom: 0.15rem; + font-size: 1.25rem; } -figure.m-figure.m-flat img { - border-bottom-left-radius: 0.2rem; - border-bottom-right-radius: 0.2rem; +article > header p { + color: #f0f0f0; + font-size: 1.125rem; } -figure.m-figure figcaption { - margin-top: 0.5rem; - margin-bottom: 0.5rem; - font-weight: bold; - font-size: 1.17rem; +article > header h1::after { + content: " "; + clear: both; + display: table; } -figure.m-figure a img { - margin-left: -1rem; - margin-right: -1rem; +article > footer { + color: #c5c5c5; } -figure.m-figure.m-fullwidth, figure.m-figure.m-fullwidth > * { - display: block; +article > footer p { + font-style: italic; + font-size: 0.85rem; + text-indent: 0; } -figure.m-figure.m-fullwidth > *:first-child { - display: inline; +article section:target { + margin-left: -1.0rem; + border-left-style: solid; + border-left-width: 0.25rem; + padding-left: 0.75rem; + border-color: #a5c9ea; } -figure.m-figure.m-fullwidth img { - width: 100%; +article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, +article section > h4 a, article section > h5 a, article section > h6 a { + text-decoration: none; } -figure.m-figure.m-fullwidth:after { - content: ' '; - display: block; - margin-top: 1rem; - height: 1px; +#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { + background-size: cover; + background-color: #0f1217; + background-position: center center; + background-repeat: no-repeat; + margin-top: -4rem; + padding-top: 5rem; } -figure.m-code-figure, figure.m-console-figure { - margin-top: 0; - margin-left: 0; - margin-right: 0; - position: relative; - padding: 1rem; +#m-landing-image { + color: #ffffff; } -figure.m-code-figure:before, figure.m-console-figure:before { - position: absolute; - content: ' '; - top: 0; - bottom: 0; - left: 0; - right: 0; - z-index: -1; - border-style: solid; - border-width: 0.125rem; - border-radius: 0.2rem; +#m-cover-image { + height: 30rem; + margin-bottom: -26rem; } -figure.m-code-figure:before { - border-color: #282e36; +#m-landing-cover h1 { + font-size: 2.8rem; + margin-top: -0.5rem; + padding-left: 1.5rem; + padding-bottom: 1rem; + text-transform: lowercase; } -figure.m-console-figure:before { - border-color: #000000; +#m-landing-cover { + padding-bottom: 10rem; + margin-bottom: -6rem; } -figure.m-code-figure.m-flat:before, figure.m-console-figure.m-flat:before { - border-color: transparent; +article#m-jumbo { + margin-top: -1rem; } -figure.m-code-figure > pre:first-child, figure.m-console-figure > pre:first-child { - position: relative; - margin: -1rem -1rem 1rem -1rem; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; +#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { + background: linear-gradient(transparent 0%, transparent 50%, #2f363f 100%); + width: 100%; + height: 100%; } -article section:target figure.m-code-figure, article section:target figure.m-console-figure { - z-index: 1; +article#m-jumbo > header h1, article#m-jumbo > header h2 { + text-align: center; + font-weight: bold; } -figure.m-figure.m-default:before { border-color: #34424d; } -figure.m-figure.m-default figcaption { color: #dcdcdc; } -figure.m-figure.m-primary:before { border-color: #a5c2db; } -figure.m-figure.m-primary figcaption { color: #a5c9ea; } -figure.m-figure.m-success:before { border-color: #2a703f; } -figure.m-figure.m-success figcaption { color: #3bd267; } -figure.m-figure.m-warning:before { border-color: #6d702a; } -figure.m-figure.m-warning figcaption { color: #c7cf2f; } -figure.m-figure.m-danger:before { border-color: #702b2a; } -figure.m-figure.m-danger figcaption { color: #cd3431; } -figure.m-figure.m-info:before { border-color: #2a4f70; } -figure.m-figure.m-info figcaption { color: #2f83cc; } -figure.m-figure.m-dim:before { border-color: #2d3236; } -figure.m-figure.m-dim { color: #747474; } -figure.m-figure.m-dim a { color: #acacac; } -figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m-dim a:active { - color: #747474; +article#m-jumbo > header a { + text-decoration: none; } -.m-imagegrid > div { - background-color: #2f363f; /* to avoid section HL shining through */ +article#m-jumbo > header #m-jumbo-cover { + padding-bottom: 5rem; } -.m-imagegrid > div > figure { - display: block; - float: left; - position: relative; - margin: 0; +article#m-jumbo > header #m-jumbo-image { + font-size: 2.5vmin; + margin-bottom: -3rem; } -.m-imagegrid > div > figure > div, -.m-imagegrid > div > figure > figcaption, -.m-imagegrid > div > figure > a > div, -.m-imagegrid > div > figure > a > figcaption { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - border-color: #2f363f; - border-style: solid; - border-width: 0.25rem; - padding: 0.5rem; +article#m-jumbo > header h1 { + font-size: 10vmin; } -.m-imagegrid > div > figure:first-child > div, -.m-imagegrid > div > figure:first-child > figcaption, -.m-imagegrid > div > figure:first-child > a > div, -.m-imagegrid > div > figure:first-child > a > figcaption { - border-left-width: 0; +article#m-jumbo > header h2 { + font-size: 3vmin; } -.m-imagegrid > div > figure:last-child > div, -.m-imagegrid > div > figure:last-child > figcaption, -.m-imagegrid > div > figure:last-child > a > div, -.m-imagegrid > div > figure:last-child > a > figcaption { - border-right-width: 0; +@media screen and (max-height: 640px) , screen and (max-width: 640px) { + article#m-jumbo > header h1 { + font-size: 3rem; + } + article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { + font-size: 1rem; + } } -.m-imagegrid > div > figure > figcaption, -.m-imagegrid > div > figure > a > figcaption { - color: transparent; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - font-size: 0.75rem; +article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { + color: #ffffff; } -.m-imagegrid > div > figure > div::before, -.m-imagegrid > div > figure > figcaption::before, -.m-imagegrid > div > figure > a > div::before, -.m-imagegrid > div > figure > a > figcaption::before { - content: ''; +article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { + color: #f0f0f0; +} +article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { + color: #000000; +} +article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { + color: #0f0f0f; +} +.m-landing-news h3 a { + color: #dcdcdc; + text-decoration: none; + text-transform: uppercase; +} +.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { + color: #a5c9ea; +} +.m-landing-news time { display: inline-block; - height: 100%; - vertical-align: bottom; - width: 0; + margin-left: 1rem; + float: right; } -.m-imagegrid > div > figure:hover > figcaption, -.m-imagegrid > div > figure:hover > a > figcaption { - background: linear-gradient(transparent 0%, transparent 75%, rgba(0, 0, 0, 0.85) 100%); - color: #ffffff; +.m-article-pagination { + text-align: center; + padding: 1rem; } -.m-imagegrid > div > figure > img, -.m-imagegrid > div > figure > a > img { - width: 100%; - height: 100%; +nav.m-navpanel { + text-align: center; } -.m-imagegrid > div::after { - display: block; - content: ' '; - clear: both; +nav.m-navpanel h3 { + text-transform: uppercase; + font-weight: normal; } -@media screen and (max-width: 767px) { - .m-imagegrid > div > figure { - float: none; - width: 100% !important; - } - .m-imagegrid > div > figure > div, - .m-imagegrid > div > figure > figcaption, - .m-imagegrid > div > figure > a > div, - .m-imagegrid > div > figure > a > figcaption { - border-left-width: 0; - border-right-width: 0; - } +nav.m-navpanel ol { + text-transform: lowercase; } -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-note, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-frame, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-block, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-imagegrid, -.m-container-inflatable > .m-row > [class*='m-col-'] > pre, -.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-code-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-console-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-note, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-frame, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-block, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-imagegrid, -.m-container-inflatable > .m-row > [class*='m-col-'] section > pre, -.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-code-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-console-figure { - margin-left: -1rem; - margin-right: -1rem; +nav.m-navpanel ol, nav.m-navpanel ul { + list-style-type: none; + padding: 0; } -@media screen and (min-width: 576px) { - .m-container-inflatable > .m-row > .m-col-s-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-s-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +nav.m-navpanel a { + color: #ffffff; + text-decoration: none; } -@media screen and (min-width: 768px) { - .m-container-inflatable > .m-row > .m-col-m-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-m-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { + color: #a5c9ea; } -@media screen and (min-width: 992px) { - .m-container-inflatable > .m-row > .m-col-l-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-l-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +ul.m-tagcloud li { display: inline; } +ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } +ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } +ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } +ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } +ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } +article section:target figure.m-code-figure, article section:target figure.m-console-figure { + z-index: 1; } +article, article > header, article section { margin-bottom: 1rem; } +article:last-child, article section:last-child { margin-bottom: 0; } .m-container-inflatable section:target > .m-note, .m-container-inflatable section:target > .m-frame, .m-container-inflatable section:target > .m-block, @@ -1720,101 +1815,6 @@ figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m- .m-container-inflatable section:target section > .m-note.m-dim { border-left-color: #747474; } -pre.m-code span.hll { - margin-left: -1.0rem; - margin-right: -1.0rem; - padding-left: 1.0rem; -} -pre.m-code.m-inverted { - color: rgba(230, 230, 230, 0.33); -} -pre.m-code.m-inverted > span { - opacity: 0.3333; -} -pre.m-code.m-inverted > span.hll { - color: #dcdcdc; - opacity: 1; - background-color: transparent; - border-color: transparent; -} -div.m-math { - overflow-x: auto; - overflow-y: hidden; - text-align: center; -} -div.m-plot svg { - text-align: center; -} -div.m-plot .m-background { - fill: #34424d; -} -div.m-plot svg .m-label { font-size: 11px; } -div.m-plot svg .m-title { font-size: 13px; } -div.m-plot svg .m-label, div.m-plot svg .m-title { fill: #dcdcdc; } -div.m-plot svg .m-line { - stroke: #dcdcdc; - stroke-width: 0.8; -} -div.m-plot svg .m-error { - stroke: #ffffff; - stroke-width: 1.5; -} -div.m-plot svg .m-label.m-dim { fill: #747474; } -div.m-math svg, svg.m-math { fill: #dcdcdc; } -div.m-math.m-default svg, svg.m-math.m-default, div.m-plot svg .m-bar.m-default { - fill: #dcdcdc; -} -div.m-math.m-primary svg, svg.m-math.m-primary, div.m-plot svg .m-bar.m-primary { - fill: #a5c9ea; -} -div.m-math.m-success svg, svg.m-math.m-success, div.m-plot svg .m-bar.m-success { - fill: #3bd267; -} -div.m-math.m-warning svg, svg.m-math.m-warning, div.m-plot svg .m-bar.m-warning { - fill: #c7cf2f; -} -div.m-math.m-danger svg, svg.m-math.m-danger, div.m-plot svg .m-bar.m-danger { - fill: #cd3431; -} -div.m-math.m-info svg, svg.m-math.m-info, div.m-plot svg .m-bar.m-info { - fill: #2f83cc; -} -div.m-math.m-dim svg, svg.m-math.m-dim, div.m-plot svg .m-bar.m-dim { - fill: #747474; -} -p, ul, ol, dl, blockquote, pre, figure.m-code-figure, figure.m-console-figure, -hr, article, article > header, article section, -.m-note, .m-frame, .m-block, div.m-button, -div.m-scroll, table.m-table, div.m-image, img.m-image, svg.m-image, -figure.m-figure, .m-imagegrid, div.m-math { - margin-bottom: 1rem; -} -p:last-child, ul:last-child, ol:last-child, dl:last-child, blockquote:last-child, -pre:last-child, figure.m-code-figure:last-child, figure.m-console-figure:last-child, -hr:last-child, article:last-child, article section:last-child, -.m-note:last-child, .m-frame:last-child, .m-block:last-child, -div.m-button:last-child, div.m-scroll:last-child, table.m-table:last-child, -img.m-image:last-child, svg.m-image:last-child, div.m-image:last-child, -figure.m-figure:last-child, .m-imagegrid:last-child, div.m-math:last-child { - margin-bottom: 0; -} -li > p:last-child, li > blockquote:last-child, li > pre:last-child, -li > figure.m-code-figure:last-child, li > figure.m-console-figure:last-child, -li > .m-note:last-child, li > .m-frame:last-child, li > .m-block:last-child, -li > div.m-button:last-child, li > div.m-scroll:last-child, li > table.m-table:last-child, -li > img.m-image:last-child, li > svg.m-image:last-child, li > div.m-image:last-child, -li > figure.m-figure:last-child, li > div.m-math:last-child { - margin-bottom: 1rem; -} -li:last-child > p:last-child, li:last-child > blockquote:last-child, li:last-child > pre:last-child, -li:last-child > figure.m-code-figure:last-child, li:last-child > figure.m-console-figure:last-child, -li:last-child > .m-note:last-child, li:last-child > .m-frame:last-child, li:last-child > .m-block:last-child, -li:last-child > div.m-button:last-child, li:last-child > div.m-scroll:last-child, -li:last-child > table.m-table:last-child, li:last-child > img.m-image:last-child, -li:last-child > svg.m-image:last-child, li:last-child > div.m-image:last-child, -li:last-child > figure.m-figure:last-child, li:last-child > div.m-math:last-child { - margin-bottom: 0; -} .m-code .hll { background-color: #34424d } .m-code .c { color: #a5c9ea } diff --git a/css/m-dark.compiled.css b/css/m-dark.compiled.css index 48d606de..c295debf 100644 --- a/css/m-dark.compiled.css +++ b/css/m-dark.compiled.css @@ -487,1172 +487,1267 @@ code { code.m-console { background-color: #000000; } -body > header > nav { - width: 100%; - background-color: #22272e; - min-height: 3rem; +div.m-scroll { + max-width: 100%; + overflow-x: auto; } -body > header > nav.m-navbar-landing, -body > header > nav.m-navbar-cover { - background-color: transparent; - position: relative; +.m-fullwidth { + width: 100%; } -body > header > nav.m-navbar-landing { - opacity: 0.8; +.m-text-center, .m-text-center.m-noindent, table.m-table th.m-text-center, .m-text-center p { + text-align: center; } -body > header > nav.m-navbar-cover { - background-color: rgba(34, 39, 46, 0.25); - opacity: 1; +.m-text-left, .m-text-left.m-noindent, table.m-table th.m-text-left, .m-text-right p { + text-align: left; } -body > header > nav.m-navbar-landing:hover, -body > header > nav.m-navbar-cover:hover { - background-color: rgba(34, 39, 46, 0.75); - opacity: 1; +.m-text-right, .m-text-right.m-noindent, table.m-table th.m-text-right, .m-text-right p { + text-align: right; } -body> header > nav.m-navbar-landing:target, -body> header > nav.m-navbar-cover:target { - background-color: #22272e; - opacity: 1; +.m-text-top, table.m-table th.m-text-top, table.m-table td.m-text-top { + vertical-align: top; } -body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { - visibility: hidden; +.m-text-middle, table.m-table th.m-text-middle, table.m-table td.m-text-middle { + vertical-align: middle; } -body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { - visibility: visible; +.m-text-bottom, table.m-table th.m-text-bottom, table.m-table td.m-text-bottom { + vertical-align: bottom; } -body > header > nav { - margin-left: auto; - margin-right: auto; - color: #ffffff; +.m-text.m-small { + font-size: 85.4%; } -body > header > nav a { - text-decoration: none; - text-transform: none; - display: inline-block; - vertical-align: middle; - line-height: 2.75rem; - color: #ffffff; +.m-text.m-big { + font-size: 117%; } -body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { - text-transform: uppercase; +.m-text.m-strong { font-weight: bold; - font-size: 1.125rem; - padding-left: 1rem; - padding-right: 1rem; } -body > header > nav a#m-navbar-brand .m-thin { +.m-text.m-em { + font-style: italic; +} +h1 .m-thin, h2 .m-thin, h3 .m-thin, h4 .m-thin, h5 .m-thin, h6 .m-thin { font-weight: normal; } -body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { - content:'\2630'; +ul.m-unstyled, ol.m-unstyled { + list-style-type: none; + padding-left: 0; } -body > header > nav #m-navbar-collapse { - padding-bottom: 1rem; +ul[class*='m-block-'], ol[class*='m-block-'] { + padding-left: 0; } -body > header > nav #m-navbar-collapse li { - border-style: solid; - border-color: transparent; - border-width: 0 0 0 0.25rem; - margin-left: -1rem; +ul[class*='m-block-'] li, ol[class*='m-block-'] li { + display: inline; } -body > header > nav #m-navbar-collapse li a { - border-style: solid; - border-color: transparent; - line-height: 1.5rem; - margin-left: -0.25rem; - padding-left: 0.75rem; - border-width: 0 0 0 0.25rem; - width: 100%; +ul[class*='m-block-bar-'] li:not(:last-child)::after, ol[class*='m-block-bar-'] li:not(:last-child)::after { + content: " | "; } -body > header > nav #m-navbar-collapse li a#m-navbar-current { - color: #5b9dd9; - border-color: #5b9dd9; +@media screen and (min-width: 576px) { + ul.m-block-bar-s, ol.m-block-bar-s { padding-left: 2rem; } + ul.m-block-bar-s li, ol.m-block-bar-s li { display: list-item; } + ul.m-block-bar-s li:not(:last-child)::after, ol.m-block-bar-s li:not(:last-child)::after { content: ""; } } -body > header > nav ol { - list-style-type: none; - margin: 0; +@media screen and (min-width: 768px) { + ul.m-block-bar-m, ol.m-block-bar-m { padding-left: 2rem; } + ul.m-block-bar-m li, ol.m-block-bar-m li { display: list-item; } + ul.m-block-bar-m li:not(:last-child)::after, ol.m-block-bar-m li:not(:last-child)::after { content: ""; } } -body > header > nav ol ol { - padding-left: 1.5rem; +@media screen and (min-width: 992px) { + ul.m-block-bar-l, ol.m-block-bar-l { padding-left: 2rem; } + ul.m-block-bar-l li, ol.m-block-bar-l li { display: list-item; } + ul.m-block-bar-l li:not(:last-child)::after, ol.m-block-bar-l li:not(:last-child)::after { content: ""; } } -body > header > nav [class*='m-col-'] { - padding-top: 0; - padding-bottom: 0; +p.m-poem { + text-indent: 0; + text-align: left; + margin-left: 1.5rem; } -body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { - color: #a5c9ea; +p.m-transition { + color: #405363; + text-indent: 0; + text-align: center; + font-size: 2rem; } -body > header > nav #m-navbar-collapse li:hover { - border-color: #a5c9ea; +dl.m-diary { + margin-bottom: 1.25rem; } -body > header > nav #m-navbar-collapse li a:hover, -body > header > nav #m-navbar-collapse li a:focus, -body > header > nav #m-navbar-collapse li a:active { - border-color: #a5c9ea; - background-color: #292f37; +dl.m-diary:last-child { + margin-bottom: 0.25rem; } -body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { - background-color: rgba(41, 47, 55, 0.5); +dl.m-diary dt { + font-weight: bold; + width: 3.5rem; + float: left; + clear: both; + padding-top: 0.25rem; } -body > header > nav #m-navbar-hide { - display: none; +dl.m-diary dd { + padding-top: 0.25rem; + padding-left: 3.5rem; } -body > header > nav:target #m-navbar-collapse { - display: block; +.m-note { + border-radius: 0.2rem; + padding: 1rem; } -body > header > nav:target #m-navbar-show { - display: none; +.m-note pre, .m-note code { + background-color: rgba(34, 39, 46, 0.5); } -body > header > nav:target #m-navbar-hide { - display: inline-block; +.m-frame { + background-color: #2f363f; + border-style: solid; + border-width: 0.125rem; + border-radius: 0.2rem; + border-color: #405363; + padding: 0.875rem; } -@media screen and (min-width: 768px) { - body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, - body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { - display: none; - } - body > header > nav #m-navbar-collapse li a { - line-height: 2.75rem; - } - body > header > nav a, body > header > nav #m-navbar-collapse li a { - margin-left: 0; - padding-left: 1rem; - padding-right: 1rem; - white-space: nowrap; - } - body > header > nav #m-navbar-collapse { - padding-bottom: 0; - } - body > header > nav #m-navbar-collapse li ol { - background-color: #22272e; - } - body > header > nav #m-navbar-collapse ol ol li { - margin-left: 0; - padding-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse ol ol li a { - padding-left: 0.75rem; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li { - margin-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li > a { - border-width: 0 0 0.25rem 0; - } - body > header > nav #m-navbar-collapse ol { - padding-left: 0; - padding-right: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { - float: left; - } - body > header > nav #m-navbar-collapse ol ol { - z-index: 99999; - position: absolute; - visibility: hidden; - } - body > header > nav #m-navbar-collapse li:hover ol { - visibility: visible; - } +.m-block { + border-style: solid; + border-width: 0.0625rem; + border-left-width: 0.25rem; + border-radius: 0.2rem; + border-color: #405363; + padding: 0.9375rem 0.9375rem 0.9375rem 0.75rem; } -body > footer { - width: 100%; +.m-block.m-badge::after { + content: ' '; + display: block; + clear: both; } -body > footer > nav { - padding-top: 1rem; - padding-bottom: 1rem; - font-size: 0.85rem; - text-align: center; - color: #c5c5c5; - background-color: #444e5c; +.m-block.m-badge h3 { + margin-left: 5rem; } -body > footer > nav h3, body > footer > nav h3 a { - text-transform: uppercase; - font-weight: normal; +.m-block.m-badge p { + margin-left: 5rem; + text-indent: 0; } -body > footer > nav ul { - list-style-type: none; - padding: 0; - margin: 0; +.m-block.m-badge img { + width: 4rem; + height: 4rem; + border-radius: 2rem; + float: left; } -body > footer > nav a { +div.m-button { + text-align: center; +} +div.m-button a { + display: inline-block; + border-radius: 0.2rem; + padding-top: 0.75rem; + padding-bottom: 0.75rem; + padding-left: 1.5rem; + padding-right: 1.5rem; text-decoration: none; - text-transform: none; - color: #ffffff; + font-size: 1.17rem; } -body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { - color: #a5c9ea; +div.m-button.m-fullwidth a { + display: block; + padding-left: 0.5rem; + padding-right: 0.5rem; } -body > main { - padding-top: 1rem; - padding-bottom: 1rem; +div.m-button a .m-big:first-child { + font-size: 1.37rem; + font-weight: bold; } -article h1 { - font-size: 1.75rem; +div.m-button a .m-small:last-child { + font-size: 0.854rem; } -article h1 .m-breadcrumb { - color: #747474; +.m-label { + border-radius: 0.2rem; + font-size: 75%; font-weight: normal; + padding: 0.125rem 0.25rem; + vertical-align: 7.5%; } -article h1 .m-breadcrumb a { - color: #a5c9ea; +.m-label.m-flat { + border-width: 0.0625rem; + border-style: solid; + border-color: #747474; + padding: 0.0625rem 0.1875rem; } -article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { - color: #dcdcdc; +table.m-table { + border-collapse: collapse; + margin-left: auto; + margin-right: auto; } -article > header h1 { - font-size: 2rem; - margin-bottom: 0.5rem; +table.m-table.m-big { + margin-top: 1.75rem; } -article h1 a, article > header h1, article > header h1 a, -article section > h2, article section > h2 a, -article section > h3, article section > h3 a, -article section > h4, article section > h4 a, -article section > h5, article section > h5 a, -article section > h6, article section > h6 a { - color: #a5c9ea; +div.m-scroll > table.m-table:last-child { + margin-bottom: 0.0625rem; } -article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, -article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, -article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, -article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, -article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, -article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { - color: #dcdcdc; +table.m-table:not(.m-flat) tbody tr:hover { + background-color: #405363; } -article > header .m-date { - display: block; - width: 2.5rem; - float: left; - text-align: center; - line-height: 95%; - font-size: 0.75rem; - font-weight: normal; - white-space: nowrap; - border-right-style: solid; - border-right-width: 0.125rem; - border-color: #a5c9ea; - padding-right: 0.75rem; - margin-top: -0.1rem; - margin-right: 0.75rem; - margin-bottom: 0.25rem; +table.m-table th, table.m-table td { + vertical-align: top; + border-style: solid; + border-top-width: 0.0625rem; + border-left-width: 0; + border-right-width: 0; + border-bottom-width: 0; + border-color: #405363; } -article > header .m-date-day { - display: block; - font-weight: bold; - padding-top: 0.2rem; - padding-bottom: 0.15rem; - font-size: 1.25rem; +table.m-table caption { + padding-bottom: 0.5rem; } -article > header p { - color: #f0f0f0; - font-size: 1.125rem; +table.m-table thead tr:first-child th, table.m-table thead tr:first-child td { + border-top-width: 0.125rem; } -article > header h1::after { - content: " "; - clear: both; - display: table; +table.m-table thead th, table.m-table thead td { + border-bottom-width: 0.125rem; + vertical-align: bottom; } -article > footer { - color: #c5c5c5; +table.m-table tfoot th, table.m-table tfoot td { + border-top-width: 0.125rem; } -article > footer p { - font-style: italic; - font-size: 0.85rem; - text-indent: 0; +table.m-table th, table.m-table td { + padding: 0.5rem; } -article section:target { - margin-left: -1.0rem; - border-left-style: solid; - border-left-width: 0.25rem; - padding-left: 0.75rem; - border-color: #a5c9ea; +table.m-table.m-big th, table.m-table.m-big td { + padding: 0.75rem 1rem; } -article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, -article section > h4 a, article section > h5 a, article section > h6 a { - text-decoration: none; +table.m-table th { + text-align: left; } -#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { - background-size: cover; - background-color: #0f1217; - background-position: center center; - background-repeat: no-repeat; - margin-top: -4rem; - padding-top: 5rem; +table.m-table th.m-thin { + font-weight: normal; } -#m-landing-image { - color: #ffffff; +table.m-table td.m-default, table.m-table th.m-default, +table.m-table td.m-primary, table.m-table th.m-primary, +table.m-table td.m-success, table.m-table th.m-success, +table.m-table td.m-warning, table.m-table th.m-warning, +table.m-table td.m-danger, table.m-table th.m-danger, +table.m-table td.m-info, table.m-table th.m-info, +table.m-table td.m-dim, table.m-table th.m-dim { + padding-left: 0.4375rem; + padding-right: 0.4375rem; + border-left-width: 0.0625rem; } -#m-cover-image { - height: 30rem; - margin-bottom: -26rem; +table.m-table.m-big td.m-default, table.m-table.m-big th.m-default, +table.m-table.m-big td.m-primary, table.m-table.m-big th.m-primary, +table.m-table.m-big td.m-success, table.m-table.m-big th.m-success, +table.m-table.m-big td.m-warning, table.m-table.m-big th.m-warning, +table.m-table.m-big td.m-danger, table.m-table.m-big th.m-danger, +table.m-table.m-big td.m-info, table.m-table.m-big th.m-info, +table.m-table.m-big td.m-dim, table.m-table.m-big th.m-dim { + padding-left: 0.9375rem; + padding-right: 0.9375rem; + border-left-width: 0.0625rem; } -#m-landing-cover h1 { - font-size: 2.8rem; - margin-top: -0.5rem; - padding-left: 1.5rem; - padding-bottom: 1rem; - text-transform: lowercase; +table.m-table tr.m-default td, table.m-table td.m-default, +table.m-table tr.m-default th, table.m-table th.m-default, +table.m-table tr.m-primary td, table.m-table td.m-primary, +table.m-table tr.m-primary th, table.m-table th.m-primary, +table.m-table tr.m-success td, table.m-table td.m-success, +table.m-table tr.m-success th, table.m-table th.m-success, +table.m-table tr.m-warning td, table.m-table td.m-warning, +table.m-table tr.m-warning th, table.m-table th.m-warning, +table.m-table tr.m-danger td, table.m-table td.m-danger, +table.m-table tr.m-danger th, table.m-table th.m-danger, +table.m-table tr.m-info td, table.m-table td.m-info, +table.m-table tr.m-info th, table.m-table th.m-info, +table.m-table tr.m-dim td, table.m-table td.m-dim, +table.m-table tr.m-dim th, table.m-table th.m-dim { + border-color: #2f363f; } -#m-landing-cover { - padding-bottom: 10rem; - margin-bottom: -6rem; +.m-block.m-default { border-left-color: #405363; } +.m-block.m-default h3, .m-block.m-default h4, .m-block.m-default h5, .m-block.m-default h6 { + color: #dcdcdc; } -article#m-jumbo { - margin-top: -1rem; +.m-block.m-primary { border-left-color: #a5c9ea; } +.m-block.m-primary h3, .m-block.m-primary h4, .m-block.m-primary h5, .m-block.m-primary h6 { + color: #a5c9ea; } -#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { - background: linear-gradient(transparent 0%, transparent 50%, #2f363f 100%); - width: 100%; - height: 100%; +.m-block.m-success { border-left-color: #3bd267; } +.m-block.m-success h3, .m-block.m-success h4, .m-block.m-success h5, .m-block.m-success h6 { + color: #3bd267; } -article#m-jumbo > header h1, article#m-jumbo > header h2 { - text-align: center; - font-weight: bold; +.m-block.m-warning { border-left-color: #c7cf2f; } +.m-block.m-warning h3, .m-block.m-warning h4, .m-block.m-warning h5, .m-block.m-warning h6 { + color: #c7cf2f; } -article#m-jumbo > header a { - text-decoration: none; +.m-block.m-danger { border-left-color: #cd3431; } +.m-block.m-danger h3, .m-block.m-danger h4, .m-block.m-danger h5, .m-block.m-danger h6 { + color: #cd3431; } -article#m-jumbo > header #m-jumbo-cover { - padding-bottom: 5rem; +.m-block.m-info { border-left-color: #2f83cc; } +.m-block.m-info h3, .m-block.m-info h4, .m-block.m-info h5, .m-block.m-info h6 { + color: #2f83cc; } -article#m-jumbo > header #m-jumbo-image { - font-size: 2.5vmin; - margin-bottom: -3rem; +.m-block.m-dim { + border-left-color: #747474; + color: #747474; } -article#m-jumbo > header h1 { - font-size: 10vmin; +.m-block.m-dim a { color: #acacac; } +.m-block.m-dim a:hover, .m-block.m-dim a:focus, .m-block.m-dim a:active { + color: #747474; } -article#m-jumbo > header h2 { - font-size: 3vmin; +.m-block.m-flat { border-color: transparent; } +.m-block.m-flat h3, .m-block.m-flat h4, .m-block.m-flat h5. .m-block.m-flat h6 { + color: #dcdcdc; } -@media screen and (max-height: 640px) , screen and (max-width: 640px) { - article#m-jumbo > header h1 { - font-size: 3rem; - } - article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { - font-size: 1rem; - } +.m-note.m-default { background-color: #34424d; } +.m-note.m-default, +table.m-table tr.m-default td, table.m-table td.m-default, +table.m-table tr.m-default th, table.m-table th.m-default { + color: #dcdcdc; } -article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { - color: #ffffff; +.m-note.m-default a:hover, +table.m-table tr.m-default td a:hover, table.m-table td.m-default a:hover, +table.m-table tr.m-default th a:hover, table.m-table th.m-default a:hover, +.m-note.m-default a:focus, +table.m-table tr.m-default td a:focus, table.m-table td.m-default a:focus, +table.m-table tr.m-default th a:focus, table.m-table th.m-default a:focus, +.m-note.m-default a:active, +table.m-table tr.m-default td a:active, table.m-table td.m-default a:active, +table.m-table tr.m-default th a:active, table.m-table th.m-default a:active { + color: #a5c9ea; } -article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { - color: #f0f0f0; +.m-note.m-primary a, +table.m-table tr.m-primary td a, table.m-table td.m-primary a, +table.m-table tr.m-primary th a, table.m-table th.m-primary a { + color: #5b9dd9; } -article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { - color: #000000; +.m-note.m-primary, +table.m-table tr.m-primary td, table.m-table td.m-primary, +table.m-table tr.m-primary th, table.m-table th.m-primary { + background-color: #a5c2db; + color: #2f363f; } -article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { - color: #0f0f0f; +.m-note.m-primary a, +table.m-table tr.m-primary td a, table.m-table td.m-primary a, +table.m-table tr.m-primary th a, table.m-table th.m-primary a { + color: #2a75b6; } -.m-landing-news h3 a { - color: #dcdcdc; - text-decoration: none; - text-transform: uppercase; +.m-note.m-primary a:hover, +table.m-table tr.m-primary td a:hover, table.m-table td.m-primary a:hover, +table.m-table tr.m-primary th a:hover, table.m-table th.m-primary a:hover, +.m-note.m-primary a:focus, +table.m-table tr.m-primary td a:focus, table.m-table td.m-primary a:focus, +table.m-table tr.m-primary th a:focus, table.m-table th.m-primary a:focus, +.m-note.m-primary a:active, +table.m-table tr.m-primary td a:active, table.m-table td.m-primary a:active, +table.m-table tr.m-primary th a:active, table.m-table th.m-primary a:active { + color: #2f363f; } -.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { - color: #a5c9ea; +.m-note.m-success, +table.m-table tr.m-success td, table.m-table td.m-success, +table.m-table tr.m-success th, table.m-table th.m-success { + background-color: #2a703f; + color: #acecbe; } -.m-landing-news time { - display: inline-block; - margin-left: 1rem; - float: right; +.m-note.m-success a, +table.m-table tr.m-success td a, table.m-table td.m-success a, +table.m-table tr.m-success th a, table.m-table th.m-success a { + color: #3bd267; } -.m-article-pagination { - text-align: center; - padding: 1rem; +.m-note.m-success a:hover, +table.m-table tr.m-success td a:hover, table.m-table td.m-success a:hover, +table.m-table tr.m-success th a:hover, table.m-table th.m-success a:hover, +.m-note.m-success a:focus, +table.m-table tr.m-success td a:focus, table.m-table td.m-success a:focus, +table.m-table tr.m-success th a:focus, table.m-table th.m-success a:focus, +.m-note.m-success a:active, +table.m-table tr.m-success td a:active, table.m-table td.m-success a:active, +table.m-table tr.m-success th a:active, table.m-table th.m-success a:active { + color: #acecbe; } -nav.m-navpanel { - text-align: center; +.m-note.m-warning, table.m-table tr.m-warning td, table.m-table td.m-warning, + table.m-table tr.m-warning th, table.m-table th.m-warning { + background-color: #6d702a; + color: #e9ecae; } -nav.m-navpanel h3 { - text-transform: uppercase; - font-weight: normal; +.m-note.m-warning a, table.m-table tr.m-warning td a, table.m-table td.m-warning a, + table.m-table tr.m-warning th a, table.m-table th.m-warning a { + color: #b8bf2b; } -nav.m-navpanel ol { - text-transform: lowercase; +.m-note.m-warning a:hover, +table.m-table tr.m-warning td a:hover, table.m-table td.m-warning a:hover, +table.m-table tr.m-warning th a:hover, table.m-table th.m-warning a:hover, +.m-note.m-warning a:focus, +table.m-table tr.m-warning td a:focus, table.m-table td.m-warning a:focus, +table.m-table tr.m-warning th a:focus, table.m-table th.m-warning a:focus, +.m-note.m-warning a:active, +table.m-table tr.m-warning td a:active, table.m-table td.m-warning a:active, +table.m-table tr.m-warning th a:active, table.m-table th.m-warning a:active { + color: #e9ecae; } -nav.m-navpanel ol, nav.m-navpanel ul { - list-style-type: none; - padding: 0; +.m-note.m-danger, +table.m-table tr.m-danger td, table.m-table td.m-danger, +table.m-table tr.m-danger th, table.m-table th.m-danger { + background-color: #702b2a; + color: #ff9391; } -nav.m-navpanel a { - color: #ffffff; - text-decoration: none; +.m-note.m-danger a, +table.m-table tr.m-danger td a, table.m-table td.m-danger a, +table.m-table tr.m-danger th a, table.m-table th.m-danger a { + color: #d85c59; } -nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { - color: #a5c9ea; +.m-note.m-danger a:hover, +table.m-table tr.m-danger td a:hover, table.m-table td.m-danger a:hover, +table.m-table tr.m-danger th a:hover, table.m-table th.m-danger a:hover, +.m-note.m-danger a:focus, +table.m-table tr.m-danger td a:focus, table.m-table td.m-danger a:focus, +table.m-table tr.m-danger th a:focus, table.m-table th.m-danger a:focus, +.m-note.m-danger a:active, +table.m-table tr.m-danger td a:active, table.m-table td.m-danger a:active, +table.m-table tr.m-danger th a:active, table.m-table th.m-danger a:active { + color: #ff9391; } -ul.m-tagcloud li { display: inline; } -ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } -ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } -ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } -ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } -ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } -div.m-scroll { - max-width: 100%; - overflow-x: auto; +.m-note.m-info, +table.m-table tr.m-info td, table.m-table td.m-info, +table.m-table tr.m-info th, table.m-table th.m-info { + background-color: #2a4f70; + color: #a5caeb; } -.m-fullwidth { - width: 100%; +.m-note.m-info a, +table.m-table tr.m-info td a, table.m-table td.m-info a, +table.m-table tr.m-info th a, table.m-table th.m-info a { + color: #5297d7; } -.m-text-center, .m-text-center.m-noindent, table.m-table th.m-text-center, .m-text-center p { - text-align: center; +.m-note.m-info a:hover, +table.m-table tr.m-info td a:hover, table.m-table td.m-info a:hover, +table.m-table tr.m-info th a:hover, table.m-table th.m-info a:hover, +.m-note.m-info a:focus, +table.m-table tr.m-info td a:focus, table.m-table td.m-info a:focus, +table.m-table tr.m-info th a:focus, table.m-table th.m-info a:focus, +.m-note.m-info a:active, +table.m-table tr.m-info td a:active, table.m-table td.m-info a:active, +table.m-table tr.m-info th a:active, table.m-table th.m-info a:active { + color: #a5caeb; } -.m-text-left, .m-text-left.m-noindent, table.m-table th.m-text-left, .m-text-right p { - text-align: left; +.m-note.m-dim, +table.m-table tr.m-dim td, table.m-table td.m-dim, +table.m-table tr.m-dim th, table.m-table th.m-dim { + background-color: #2d3236; + color: #747474; } -.m-text-right, .m-text-right.m-noindent, table.m-table th.m-text-right, .m-text-right p { - text-align: right; +.m-note.m-dim a, +table.m-table tr.m-dim td a, table.m-table td.m-dim a, +table.m-table tr.m-dim th a, table.m-table th.m-dim a { + color: #acacac; } -.m-text-top, table.m-table th.m-text-top, table.m-table td.m-text-top { - vertical-align: top; +.m-note.m-dim a:hover, +table.m-table tr.m-dim td a:hover, table.m-table td.m-dim a:hover, +table.m-table tr.m-dim th a:hover, table.m-table th.m-dim a:hover, +.m-note.m-dim a:focus, +table.m-table tr.m-dim td a:focus, table.m-table td.m-dim a:focus, +table.m-table tr.m-dim th a:focus, table.m-table th.m-dim a:focus, +.m-note.m-dim a:active, +table.m-table tr.m-dim td a:active, table.m-table td.m-dim a:active, +table.m-table tr.m-dim th a:active, table.m-table th.m-dim a:active { + color: #747474; } -.m-text-middle, table.m-table th.m-text-middle, table.m-table td.m-text-middle { - vertical-align: middle; +.m-text.m-default, .m-label.m-flat.m-default { color: #dcdcdc; } +.m-text.m-primary, .m-label.m-flat.m-primary { color: #a5c9ea; } +.m-text.m-success, .m-label.m-flat.m-success { color: #3bd267; } +.m-text.m-warning, .m-label.m-flat.m-warning { color: #c7cf2f; } +.m-text.m-danger, .m-label.m-flat.m-danger { color: #cd3431; } +.m-text.m-info, .m-label.m-flat.m-info { color: #2f83cc; } +.m-text.m-dim, .m-label.m-flat.m-dim { color: #747474; } +.m-text.m-dim a { color: #acacac; } +.m-text.m-dim a:hover, .m-text.m-dim a:focus, .m-text.m-dim a:active { + color: #747474; } -.m-text-bottom, table.m-table th.m-text-bottom, table.m-table td.m-text-bottom { - vertical-align: bottom; +div.m-button a, .m-label { color: #22272e; } +div.m-button.m-flat a { color: #dcdcdc; } +div.m-button.m-flat a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { + color: #a5c9ea; } -.m-text.m-small { - font-size: 85.4%; +div.m-button.m-default a, .m-label:not(.m-flat).m-default { background-color: #dcdcdc; } +div.m-button.m-primary a, .m-label:not(.m-flat).m-primary { background-color: #a5c9ea; } +div.m-button.m-success a, .m-label:not(.m-flat).m-success { background-color: #3bd267; } +div.m-button.m-warning a, .m-label:not(.m-flat).m-warning { background-color: #c7cf2f; } +div.m-button.m-danger a, .m-label:not(.m-flat).m-danger { background-color: #cd3431; } +div.m-button.m-info a, .m-label:not(.m-flat).m-info { background-color: #2f83cc; } +div.m-button.m-dim a, .m-label:not(.m-flat).m-dim { background-color: #747474; } +div.m-button.m-default a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { + background-color: #a5c9ea; } -.m-text.m-big { - font-size: 117%; +div.m-button.m-primary a:hover, div.m-button.m-primary a:focus, div.m-button.m-primary a:active { + background-color: #dcdcdc; } -.m-text.m-strong { - font-weight: bold; +div.m-button.m-success a:hover, div.m-button.m-success a:focus, div.m-button.m-success a:active { + background-color: #acecbe; } -.m-text.m-em { - font-style: italic; +div.m-button.m-warning a:hover, div.m-button.m-warning a:focus, div.m-button.m-warning a:active { + background-color: #e9ecae; } -h1 .m-thin, h2 .m-thin, h3 .m-thin, h4 .m-thin, h5 .m-thin, h6 .m-thin { - font-weight: normal; +div.m-button.m-danger a:hover, div.m-button.m-danger a:focus, div.m-button.m-danger a:active { + background-color: #ff9391; } -ul.m-unstyled, ol.m-unstyled { - list-style-type: none; - padding-left: 0; +div.m-button.m-info a:hover, div.m-button.m-info a:focus, div.m-button.m-info a:active { + background-color: #5297d7; } -ul[class*='m-block-'], ol[class*='m-block-'] { - padding-left: 0; +div.m-button.m-dim a:hover, div.m-button.m-dim a:focus, div.m-button.m-dim a:active { + background-color: #acacac; } -ul[class*='m-block-'] li, ol[class*='m-block-'] li { - display: inline; +img.m-image, svg.m-image { + display: block; + margin-left: auto; + margin-right: auto; } -ul[class*='m-block-bar-'] li:not(:last-child)::after, ol[class*='m-block-bar-'] li:not(:last-child)::after { - content: " | "; +div.m-image { + text-align: center; } -@media screen and (min-width: 576px) { - ul.m-block-bar-s, ol.m-block-bar-s { padding-left: 2rem; } - ul.m-block-bar-s li, ol.m-block-bar-s li { display: list-item; } - ul.m-block-bar-s li:not(:last-child)::after, ol.m-block-bar-s li:not(:last-child)::after { content: ""; } -} -@media screen and (min-width: 768px) { - ul.m-block-bar-m, ol.m-block-bar-m { padding-left: 2rem; } - ul.m-block-bar-m li, ol.m-block-bar-m li { display: list-item; } - ul.m-block-bar-m li:not(:last-child)::after, ol.m-block-bar-m li:not(:last-child)::after { content: ""; } -} -@media screen and (min-width: 992px) { - ul.m-block-bar-l, ol.m-block-bar-l { padding-left: 2rem; } - ul.m-block-bar-l li, ol.m-block-bar-l li { display: list-item; } - ul.m-block-bar-l li:not(:last-child)::after, ol.m-block-bar-l li:not(:last-child)::after { content: ""; } -} -p.m-poem { - text-indent: 0; - text-align: left; - margin-left: 1.5rem; -} -p.m-transition { - color: #405363; - text-indent: 0; - text-align: center; - font-size: 2rem; -} -dl.m-diary { - margin-bottom: 1.25rem; -} -dl.m-diary:last-child { - margin-bottom: 0.25rem; -} -dl.m-diary dt { - font-weight: bold; - width: 3.5rem; - float: left; - clear: both; - padding-top: 0.25rem; -} -dl.m-diary dd { - padding-top: 0.25rem; - padding-left: 3.5rem; -} -.m-note { +img.m-image, svg.m-image, div.m-image img { + max-width: 100%; border-radius: 0.2rem; - padding: 1rem; } -.m-note pre, .m-note code { - background-color: rgba(34, 39, 46, 0.5); +div.m-image.m-fullwidth img, div.m-image.m-fullwidth svg { + width: 100%; } -.m-frame { - background-color: #2f363f; +figure.m-figure { + max-width: 100%; + margin-top: 0; + margin-left: auto; + margin-right: auto; + position: relative; + display: table; +} +figure.m-figure:before { + position: absolute; + content: ' '; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: -1; border-style: solid; border-width: 0.125rem; border-radius: 0.2rem; border-color: #405363; - padding: 0.875rem; } -.m-block { - border-style: solid; - border-width: 0.0625rem; - border-left-width: 0.25rem; - border-radius: 0.2rem; - border-color: #405363; - padding: 0.9375rem 0.9375rem 0.9375rem 0.75rem; +figure.m-figure.m-flat:before { + border-color: transparent; } -.m-block.m-badge::after { - content: ' '; - display: block; - clear: both; +figure.m-figure > * { + margin-left: 1rem; + margin-right: 1rem; + display: table-caption; + caption-side: bottom; } -.m-block.m-badge h3 { - margin-left: 5rem; +figure.m-figure > *:first-child { + display: inline; } -.m-block.m-badge p { - margin-left: 5rem; - text-indent: 0; +figure.m-figure > *:last-child { + margin-bottom: 1rem; } -.m-block.m-badge img { - width: 4rem; - height: 4rem; - border-radius: 2rem; - float: left; +figure.m-figure img { + position: relative; + margin-left: 0; + margin-right: 0; + margin-bottom: 0; + border-top-left-radius: 0.2rem; + border-top-right-radius: 0.2rem; + max-width: 100%; } -div.m-button { - text-align: center; +figure.m-figure.m-flat img { + border-bottom-left-radius: 0.2rem; + border-bottom-right-radius: 0.2rem; } -div.m-button a { - display: inline-block; - border-radius: 0.2rem; - padding-top: 0.75rem; - padding-bottom: 0.75rem; - padding-left: 1.5rem; - padding-right: 1.5rem; - text-decoration: none; +figure.m-figure figcaption { + margin-top: 0.5rem; + margin-bottom: 0.5rem; + font-weight: bold; font-size: 1.17rem; } -div.m-button.m-fullwidth a { - display: block; - padding-left: 0.5rem; - padding-right: 0.5rem; +figure.m-figure a img { + margin-left: -1rem; + margin-right: -1rem; } -div.m-button a .m-big:first-child { - font-size: 1.37rem; - font-weight: bold; +figure.m-figure.m-fullwidth, figure.m-figure.m-fullwidth > * { + display: block; } -div.m-button a .m-small:last-child { - font-size: 0.854rem; +figure.m-figure.m-fullwidth > *:first-child { + display: inline; } -.m-label { - border-radius: 0.2rem; - font-size: 75%; - font-weight: normal; - padding: 0.125rem 0.25rem; - vertical-align: 7.5%; +figure.m-figure.m-fullwidth img { + width: 100%; } -.m-label.m-flat { - border-width: 0.0625rem; - border-style: solid; - border-color: #747474; - padding: 0.0625rem 0.1875rem; +figure.m-figure.m-fullwidth:after { + content: ' '; + display: block; + margin-top: 1rem; + height: 1px; } -table.m-table { - border-collapse: collapse; - margin-left: auto; - margin-right: auto; +figure.m-code-figure, figure.m-console-figure { + margin-top: 0; + margin-left: 0; + margin-right: 0; + position: relative; + padding: 1rem; } -table.m-table.m-big { - margin-top: 1.75rem; +figure.m-code-figure:before, figure.m-console-figure:before { + position: absolute; + content: ' '; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: -1; + border-style: solid; + border-width: 0.125rem; + border-radius: 0.2rem; } -div.m-scroll > table.m-table:last-child { - margin-bottom: 0.0625rem; +figure.m-code-figure:before { + border-color: #282e36; } -table.m-table:not(.m-flat) tbody tr:hover { - background-color: #405363; +figure.m-console-figure:before { + border-color: #000000; } -table.m-table th, table.m-table td { - vertical-align: top; - border-style: solid; - border-top-width: 0.0625rem; - border-left-width: 0; - border-right-width: 0; - border-bottom-width: 0; - border-color: #405363; +figure.m-code-figure.m-flat:before, figure.m-console-figure.m-flat:before { + border-color: transparent; } -table.m-table caption { - padding-bottom: 0.5rem; +figure.m-code-figure > pre:first-child, figure.m-console-figure > pre:first-child { + position: relative; + margin: -1rem -1rem 1rem -1rem; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; } -table.m-table thead tr:first-child th, table.m-table thead tr:first-child td { - border-top-width: 0.125rem; +figure.m-figure.m-default:before { border-color: #34424d; } +figure.m-figure.m-default figcaption { color: #dcdcdc; } +figure.m-figure.m-primary:before { border-color: #a5c2db; } +figure.m-figure.m-primary figcaption { color: #a5c9ea; } +figure.m-figure.m-success:before { border-color: #2a703f; } +figure.m-figure.m-success figcaption { color: #3bd267; } +figure.m-figure.m-warning:before { border-color: #6d702a; } +figure.m-figure.m-warning figcaption { color: #c7cf2f; } +figure.m-figure.m-danger:before { border-color: #702b2a; } +figure.m-figure.m-danger figcaption { color: #cd3431; } +figure.m-figure.m-info:before { border-color: #2a4f70; } +figure.m-figure.m-info figcaption { color: #2f83cc; } +figure.m-figure.m-dim:before { border-color: #2d3236; } +figure.m-figure.m-dim { color: #747474; } +figure.m-figure.m-dim a { color: #acacac; } +figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m-dim a:active { + color: #747474; } -table.m-table thead th, table.m-table thead td { - border-bottom-width: 0.125rem; - vertical-align: bottom; +.m-imagegrid > div { + background-color: #2f363f; /* to avoid section HL shining through */ } -table.m-table tfoot th, table.m-table tfoot td { - border-top-width: 0.125rem; +.m-imagegrid > div > figure { + display: block; + float: left; + position: relative; + margin: 0; } -table.m-table th, table.m-table td { +.m-imagegrid > div > figure > div, +.m-imagegrid > div > figure > figcaption, +.m-imagegrid > div > figure > a > div, +.m-imagegrid > div > figure > a > figcaption { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + border-color: #2f363f; + border-style: solid; + border-width: 0.25rem; padding: 0.5rem; } -table.m-table.m-big th, table.m-table.m-big td { - padding: 0.75rem 1rem; +.m-imagegrid > div > figure:first-child > div, +.m-imagegrid > div > figure:first-child > figcaption, +.m-imagegrid > div > figure:first-child > a > div, +.m-imagegrid > div > figure:first-child > a > figcaption { + border-left-width: 0; } -table.m-table th { - text-align: left; +.m-imagegrid > div > figure:last-child > div, +.m-imagegrid > div > figure:last-child > figcaption, +.m-imagegrid > div > figure:last-child > a > div, +.m-imagegrid > div > figure:last-child > a > figcaption { + border-right-width: 0; } -table.m-table th.m-thin { - font-weight: normal; +.m-imagegrid > div > figure > figcaption, +.m-imagegrid > div > figure > a > figcaption { + color: transparent; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-size: 0.75rem; } -table.m-table td.m-default, table.m-table th.m-default, -table.m-table td.m-primary, table.m-table th.m-primary, -table.m-table td.m-success, table.m-table th.m-success, -table.m-table td.m-warning, table.m-table th.m-warning, -table.m-table td.m-danger, table.m-table th.m-danger, -table.m-table td.m-info, table.m-table th.m-info, -table.m-table td.m-dim, table.m-table th.m-dim { - padding-left: 0.4375rem; - padding-right: 0.4375rem; - border-left-width: 0.0625rem; +.m-imagegrid > div > figure > div::before, +.m-imagegrid > div > figure > figcaption::before, +.m-imagegrid > div > figure > a > div::before, +.m-imagegrid > div > figure > a > figcaption::before { + content: ''; + display: inline-block; + height: 100%; + vertical-align: bottom; + width: 0; } -table.m-table.m-big td.m-default, table.m-table.m-big th.m-default, -table.m-table.m-big td.m-primary, table.m-table.m-big th.m-primary, -table.m-table.m-big td.m-success, table.m-table.m-big th.m-success, -table.m-table.m-big td.m-warning, table.m-table.m-big th.m-warning, -table.m-table.m-big td.m-danger, table.m-table.m-big th.m-danger, -table.m-table.m-big td.m-info, table.m-table.m-big th.m-info, -table.m-table.m-big td.m-dim, table.m-table.m-big th.m-dim { - padding-left: 0.9375rem; - padding-right: 0.9375rem; - border-left-width: 0.0625rem; +.m-imagegrid > div > figure:hover > figcaption, +.m-imagegrid > div > figure:hover > a > figcaption { + background: linear-gradient(transparent 0%, transparent 75%, rgba(0, 0, 0, 0.85) 100%); + color: #ffffff; } -table.m-table tr.m-default td, table.m-table td.m-default, -table.m-table tr.m-default th, table.m-table th.m-default, -table.m-table tr.m-primary td, table.m-table td.m-primary, -table.m-table tr.m-primary th, table.m-table th.m-primary, -table.m-table tr.m-success td, table.m-table td.m-success, -table.m-table tr.m-success th, table.m-table th.m-success, -table.m-table tr.m-warning td, table.m-table td.m-warning, -table.m-table tr.m-warning th, table.m-table th.m-warning, -table.m-table tr.m-danger td, table.m-table td.m-danger, -table.m-table tr.m-danger th, table.m-table th.m-danger, -table.m-table tr.m-info td, table.m-table td.m-info, -table.m-table tr.m-info th, table.m-table th.m-info, -table.m-table tr.m-dim td, table.m-table td.m-dim, -table.m-table tr.m-dim th, table.m-table th.m-dim { - border-color: #2f363f; +.m-imagegrid > div > figure > img, +.m-imagegrid > div > figure > a > img { + width: 100%; + height: 100%; } -.m-block.m-default { border-left-color: #405363; } -.m-block.m-default h3, .m-block.m-default h4, .m-block.m-default h5, .m-block.m-default h6 { - color: #dcdcdc; +.m-imagegrid > div::after { + display: block; + content: ' '; + clear: both; } -.m-block.m-primary { border-left-color: #a5c9ea; } -.m-block.m-primary h3, .m-block.m-primary h4, .m-block.m-primary h5, .m-block.m-primary h6 { - color: #a5c9ea; +@media screen and (max-width: 767px) { + .m-imagegrid > div > figure { + float: none; + width: 100% !important; + } + .m-imagegrid > div > figure > div, + .m-imagegrid > div > figure > figcaption, + .m-imagegrid > div > figure > a > div, + .m-imagegrid > div > figure > a > figcaption { + border-left-width: 0; + border-right-width: 0; + } } -.m-block.m-success { border-left-color: #3bd267; } -.m-block.m-success h3, .m-block.m-success h4, .m-block.m-success h5, .m-block.m-success h6 { - color: #3bd267; +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-note, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-frame, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-block, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-imagegrid, +.m-container-inflatable > .m-row > [class*='m-col-'] > pre, +.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-code-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-console-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-note, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-frame, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-block, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-imagegrid, +.m-container-inflatable > .m-row > [class*='m-col-'] section > pre, +.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-code-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-console-figure { + margin-left: -1rem; + margin-right: -1rem; } -.m-block.m-warning { border-left-color: #c7cf2f; } -.m-block.m-warning h3, .m-block.m-warning h4, .m-block.m-warning h5, .m-block.m-warning h6 { - color: #c7cf2f; +@media screen and (min-width: 576px) { + .m-container-inflatable > .m-row > .m-col-s-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-s-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-danger { border-left-color: #cd3431; } -.m-block.m-danger h3, .m-block.m-danger h4, .m-block.m-danger h5, .m-block.m-danger h6 { - color: #cd3431; +@media screen and (min-width: 768px) { + .m-container-inflatable > .m-row > .m-col-m-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-m-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-info { border-left-color: #2f83cc; } -.m-block.m-info h3, .m-block.m-info h4, .m-block.m-info h5, .m-block.m-info h6 { - color: #2f83cc; +@media screen and (min-width: 992px) { + .m-container-inflatable > .m-row > .m-col-l-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-l-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-dim { - border-left-color: #747474; - color: #747474; +pre.m-code span.hll { + margin-left: -1.0rem; + margin-right: -1.0rem; + padding-left: 1.0rem; } -.m-block.m-dim a { color: #acacac; } -.m-block.m-dim a:hover, .m-block.m-dim a:focus, .m-block.m-dim a:active { - color: #747474; +pre.m-code.m-inverted { + color: rgba(230, 230, 230, 0.33); } -.m-block.m-flat { border-color: transparent; } -.m-block.m-flat h3, .m-block.m-flat h4, .m-block.m-flat h5. .m-block.m-flat h6 { - color: #dcdcdc; +pre.m-code.m-inverted > span { + opacity: 0.3333; } -.m-note.m-default { background-color: #34424d; } -.m-note.m-default, -table.m-table tr.m-default td, table.m-table td.m-default, -table.m-table tr.m-default th, table.m-table th.m-default { +pre.m-code.m-inverted > span.hll { color: #dcdcdc; + opacity: 1; + background-color: transparent; + border-color: transparent; } -.m-note.m-default a:hover, -table.m-table tr.m-default td a:hover, table.m-table td.m-default a:hover, -table.m-table tr.m-default th a:hover, table.m-table th.m-default a:hover, -.m-note.m-default a:focus, -table.m-table tr.m-default td a:focus, table.m-table td.m-default a:focus, -table.m-table tr.m-default th a:focus, table.m-table th.m-default a:focus, -.m-note.m-default a:active, -table.m-table tr.m-default td a:active, table.m-table td.m-default a:active, -table.m-table tr.m-default th a:active, table.m-table th.m-default a:active { - color: #a5c9ea; +div.m-math { + overflow-x: auto; + overflow-y: hidden; + text-align: center; } -.m-note.m-primary a, -table.m-table tr.m-primary td a, table.m-table td.m-primary a, -table.m-table tr.m-primary th a, table.m-table th.m-primary a { - color: #5b9dd9; +div.m-plot svg { + text-align: center; } -.m-note.m-primary, -table.m-table tr.m-primary td, table.m-table td.m-primary, -table.m-table tr.m-primary th, table.m-table th.m-primary { - background-color: #a5c2db; - color: #2f363f; +div.m-plot .m-background { + fill: #34424d; } -.m-note.m-primary a, -table.m-table tr.m-primary td a, table.m-table td.m-primary a, -table.m-table tr.m-primary th a, table.m-table th.m-primary a { - color: #2a75b6; +div.m-plot svg .m-label { font-size: 11px; } +div.m-plot svg .m-title { font-size: 13px; } +div.m-plot svg .m-label, div.m-plot svg .m-title { fill: #dcdcdc; } +div.m-plot svg .m-line { + stroke: #dcdcdc; + stroke-width: 0.8; } -.m-note.m-primary a:hover, -table.m-table tr.m-primary td a:hover, table.m-table td.m-primary a:hover, -table.m-table tr.m-primary th a:hover, table.m-table th.m-primary a:hover, -.m-note.m-primary a:focus, -table.m-table tr.m-primary td a:focus, table.m-table td.m-primary a:focus, -table.m-table tr.m-primary th a:focus, table.m-table th.m-primary a:focus, -.m-note.m-primary a:active, -table.m-table tr.m-primary td a:active, table.m-table td.m-primary a:active, -table.m-table tr.m-primary th a:active, table.m-table th.m-primary a:active { - color: #2f363f; +div.m-plot svg .m-error { + stroke: #ffffff; + stroke-width: 1.5; } -.m-note.m-success, -table.m-table tr.m-success td, table.m-table td.m-success, -table.m-table tr.m-success th, table.m-table th.m-success { - background-color: #2a703f; - color: #acecbe; +div.m-plot svg .m-label.m-dim { fill: #747474; } +div.m-math svg, svg.m-math { fill: #dcdcdc; } +div.m-math.m-default svg, svg.m-math.m-default, div.m-plot svg .m-bar.m-default { + fill: #dcdcdc; } -.m-note.m-success a, -table.m-table tr.m-success td a, table.m-table td.m-success a, -table.m-table tr.m-success th a, table.m-table th.m-success a { - color: #3bd267; +div.m-math.m-primary svg, svg.m-math.m-primary, div.m-plot svg .m-bar.m-primary { + fill: #a5c9ea; } -.m-note.m-success a:hover, -table.m-table tr.m-success td a:hover, table.m-table td.m-success a:hover, -table.m-table tr.m-success th a:hover, table.m-table th.m-success a:hover, -.m-note.m-success a:focus, -table.m-table tr.m-success td a:focus, table.m-table td.m-success a:focus, -table.m-table tr.m-success th a:focus, table.m-table th.m-success a:focus, -.m-note.m-success a:active, -table.m-table tr.m-success td a:active, table.m-table td.m-success a:active, -table.m-table tr.m-success th a:active, table.m-table th.m-success a:active { - color: #acecbe; +div.m-math.m-success svg, svg.m-math.m-success, div.m-plot svg .m-bar.m-success { + fill: #3bd267; } -.m-note.m-warning, table.m-table tr.m-warning td, table.m-table td.m-warning, - table.m-table tr.m-warning th, table.m-table th.m-warning { - background-color: #6d702a; - color: #e9ecae; +div.m-math.m-warning svg, svg.m-math.m-warning, div.m-plot svg .m-bar.m-warning { + fill: #c7cf2f; } -.m-note.m-warning a, table.m-table tr.m-warning td a, table.m-table td.m-warning a, - table.m-table tr.m-warning th a, table.m-table th.m-warning a { - color: #b8bf2b; +div.m-math.m-danger svg, svg.m-math.m-danger, div.m-plot svg .m-bar.m-danger { + fill: #cd3431; } -.m-note.m-warning a:hover, -table.m-table tr.m-warning td a:hover, table.m-table td.m-warning a:hover, -table.m-table tr.m-warning th a:hover, table.m-table th.m-warning a:hover, -.m-note.m-warning a:focus, -table.m-table tr.m-warning td a:focus, table.m-table td.m-warning a:focus, -table.m-table tr.m-warning th a:focus, table.m-table th.m-warning a:focus, -.m-note.m-warning a:active, -table.m-table tr.m-warning td a:active, table.m-table td.m-warning a:active, -table.m-table tr.m-warning th a:active, table.m-table th.m-warning a:active { - color: #e9ecae; +div.m-math.m-info svg, svg.m-math.m-info, div.m-plot svg .m-bar.m-info { + fill: #2f83cc; } -.m-note.m-danger, -table.m-table tr.m-danger td, table.m-table td.m-danger, -table.m-table tr.m-danger th, table.m-table th.m-danger { - background-color: #702b2a; - color: #ff9391; +div.m-math.m-dim svg, svg.m-math.m-dim, div.m-plot svg .m-bar.m-dim { + fill: #747474; } -.m-note.m-danger a, -table.m-table tr.m-danger td a, table.m-table td.m-danger a, -table.m-table tr.m-danger th a, table.m-table th.m-danger a { - color: #d85c59; +p, ul, ol, dl, blockquote, pre, figure.m-code-figure, figure.m-console-figure, +hr, .m-note, .m-frame, .m-block, div.m-button, div.m-scroll, table.m-table, +div.m-image, img.m-image, svg.m-image, figure.m-figure, .m-imagegrid, div.m-math { + margin-bottom: 1rem; } -.m-note.m-danger a:hover, -table.m-table tr.m-danger td a:hover, table.m-table td.m-danger a:hover, -table.m-table tr.m-danger th a:hover, table.m-table th.m-danger a:hover, -.m-note.m-danger a:focus, -table.m-table tr.m-danger td a:focus, table.m-table td.m-danger a:focus, -table.m-table tr.m-danger th a:focus, table.m-table th.m-danger a:focus, -.m-note.m-danger a:active, -table.m-table tr.m-danger td a:active, table.m-table td.m-danger a:active, -table.m-table tr.m-danger th a:active, table.m-table th.m-danger a:active { - color: #ff9391; +p:last-child, ul:last-child, ol:last-child, dl:last-child, blockquote:last-child, +pre:last-child, figure.m-code-figure:last-child, figure.m-console-figure:last-child, +hr:last-child, .m-note:last-child, .m-frame:last-child, .m-block:last-child, +div.m-button:last-child, div.m-scroll:last-child, table.m-table:last-child, +img.m-image:last-child, svg.m-image:last-child, div.m-image:last-child, +figure.m-figure:last-child, .m-imagegrid:last-child, div.m-math:last-child { + margin-bottom: 0; } -.m-note.m-info, -table.m-table tr.m-info td, table.m-table td.m-info, -table.m-table tr.m-info th, table.m-table th.m-info { - background-color: #2a4f70; - color: #a5caeb; +li > p:last-child, li > blockquote:last-child, li > pre:last-child, +li > figure.m-code-figure:last-child, li > figure.m-console-figure:last-child, +li > .m-note:last-child, li > .m-frame:last-child, li > .m-block:last-child, +li > div.m-button:last-child, li > div.m-scroll:last-child, li > table.m-table:last-child, +li > img.m-image:last-child, li > svg.m-image:last-child, li > div.m-image:last-child, +li > figure.m-figure:last-child, li > div.m-math:last-child { + margin-bottom: 1rem; } -.m-note.m-info a, -table.m-table tr.m-info td a, table.m-table td.m-info a, -table.m-table tr.m-info th a, table.m-table th.m-info a { - color: #5297d7; +li:last-child > p:last-child, li:last-child > blockquote:last-child, li:last-child > pre:last-child, +li:last-child > figure.m-code-figure:last-child, li:last-child > figure.m-console-figure:last-child, +li:last-child > .m-note:last-child, li:last-child > .m-frame:last-child, li:last-child > .m-block:last-child, +li:last-child > div.m-button:last-child, li:last-child > div.m-scroll:last-child, +li:last-child > table.m-table:last-child, li:last-child > img.m-image:last-child, +li:last-child > svg.m-image:last-child, li:last-child > div.m-image:last-child, +li:last-child > figure.m-figure:last-child, li:last-child > div.m-math:last-child { + margin-bottom: 0; } -.m-note.m-info a:hover, -table.m-table tr.m-info td a:hover, table.m-table td.m-info a:hover, -table.m-table tr.m-info th a:hover, table.m-table th.m-info a:hover, -.m-note.m-info a:focus, -table.m-table tr.m-info td a:focus, table.m-table td.m-info a:focus, -table.m-table tr.m-info th a:focus, table.m-table th.m-info a:focus, -.m-note.m-info a:active, -table.m-table tr.m-info td a:active, table.m-table td.m-info a:active, -table.m-table tr.m-info th a:active, table.m-table th.m-info a:active { - color: #a5caeb; + +body > header > nav { + width: 100%; + background-color: #22272e; + min-height: 3rem; } -.m-note.m-dim, -table.m-table tr.m-dim td, table.m-table td.m-dim, -table.m-table tr.m-dim th, table.m-table th.m-dim { - background-color: #2d3236; - color: #747474; +body > header > nav.m-navbar-landing, +body > header > nav.m-navbar-cover { + background-color: transparent; + position: relative; } -.m-note.m-dim a, -table.m-table tr.m-dim td a, table.m-table td.m-dim a, -table.m-table tr.m-dim th a, table.m-table th.m-dim a { - color: #acacac; +body > header > nav.m-navbar-landing { + opacity: 0.8; } -.m-note.m-dim a:hover, -table.m-table tr.m-dim td a:hover, table.m-table td.m-dim a:hover, -table.m-table tr.m-dim th a:hover, table.m-table th.m-dim a:hover, -.m-note.m-dim a:focus, -table.m-table tr.m-dim td a:focus, table.m-table td.m-dim a:focus, -table.m-table tr.m-dim th a:focus, table.m-table th.m-dim a:focus, -.m-note.m-dim a:active, -table.m-table tr.m-dim td a:active, table.m-table td.m-dim a:active, -table.m-table tr.m-dim th a:active, table.m-table th.m-dim a:active { - color: #747474; +body > header > nav.m-navbar-cover { + background-color: rgba(34, 39, 46, 0.25); + opacity: 1; } -.m-text.m-default, .m-label.m-flat.m-default { color: #dcdcdc; } -.m-text.m-primary, .m-label.m-flat.m-primary { color: #a5c9ea; } -.m-text.m-success, .m-label.m-flat.m-success { color: #3bd267; } -.m-text.m-warning, .m-label.m-flat.m-warning { color: #c7cf2f; } -.m-text.m-danger, .m-label.m-flat.m-danger { color: #cd3431; } -.m-text.m-info, .m-label.m-flat.m-info { color: #2f83cc; } -.m-text.m-dim, .m-label.m-flat.m-dim { color: #747474; } -.m-text.m-dim a { color: #acacac; } -.m-text.m-dim a:hover, .m-text.m-dim a:focus, .m-text.m-dim a:active { - color: #747474; +body > header > nav.m-navbar-landing:hover, +body > header > nav.m-navbar-cover:hover { + background-color: rgba(34, 39, 46, 0.75); + opacity: 1; } -div.m-button a, .m-label { color: #22272e; } -div.m-button.m-flat a { color: #dcdcdc; } -div.m-button.m-flat a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { +body> header > nav.m-navbar-landing:target, +body> header > nav.m-navbar-cover:target { + background-color: #22272e; + opacity: 1; +} +body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { + visibility: hidden; +} +body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { + visibility: visible; +} +body > header > nav { + margin-left: auto; + margin-right: auto; + color: #ffffff; +} +body > header > nav a { + text-decoration: none; + text-transform: none; + display: inline-block; + vertical-align: middle; + line-height: 2.75rem; + color: #ffffff; +} +body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { + text-transform: uppercase; + font-weight: bold; + font-size: 1.125rem; + padding-left: 1rem; + padding-right: 1rem; +} +body > header > nav a#m-navbar-brand .m-thin { + font-weight: normal; +} +body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { + content:'\2630'; +} +body > header > nav #m-navbar-collapse { + padding-bottom: 1rem; +} +body > header > nav #m-navbar-collapse li { + border-style: solid; + border-color: transparent; + border-width: 0 0 0 0.25rem; + margin-left: -1rem; +} +body > header > nav #m-navbar-collapse li a { + border-style: solid; + border-color: transparent; + line-height: 1.5rem; + margin-left: -0.25rem; + padding-left: 0.75rem; + border-width: 0 0 0 0.25rem; + width: 100%; +} +body > header > nav #m-navbar-collapse li a#m-navbar-current { + color: #5b9dd9; + border-color: #5b9dd9; +} +body > header > nav ol { + list-style-type: none; + margin: 0; +} +body > header > nav ol ol { + padding-left: 1.5rem; +} +body > header > nav [class*='m-col-'] { + padding-top: 0; + padding-bottom: 0; +} +body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { color: #a5c9ea; } -div.m-button.m-default a, .m-label:not(.m-flat).m-default { background-color: #dcdcdc; } -div.m-button.m-primary a, .m-label:not(.m-flat).m-primary { background-color: #a5c9ea; } -div.m-button.m-success a, .m-label:not(.m-flat).m-success { background-color: #3bd267; } -div.m-button.m-warning a, .m-label:not(.m-flat).m-warning { background-color: #c7cf2f; } -div.m-button.m-danger a, .m-label:not(.m-flat).m-danger { background-color: #cd3431; } -div.m-button.m-info a, .m-label:not(.m-flat).m-info { background-color: #2f83cc; } -div.m-button.m-dim a, .m-label:not(.m-flat).m-dim { background-color: #747474; } -div.m-button.m-default a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { - background-color: #a5c9ea; +body > header > nav #m-navbar-collapse li:hover { + border-color: #a5c9ea; } -div.m-button.m-primary a:hover, div.m-button.m-primary a:focus, div.m-button.m-primary a:active { - background-color: #dcdcdc; +body > header > nav #m-navbar-collapse li a:hover, +body > header > nav #m-navbar-collapse li a:focus, +body > header > nav #m-navbar-collapse li a:active { + border-color: #a5c9ea; + background-color: #292f37; +} +body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { + background-color: rgba(41, 47, 55, 0.5); +} +body > header > nav #m-navbar-hide { + display: none; +} +body > header > nav:target #m-navbar-collapse { + display: block; +} +body > header > nav:target #m-navbar-show { + display: none; +} +body > header > nav:target #m-navbar-hide { + display: inline-block; +} +@media screen and (min-width: 768px) { + body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, + body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { + display: none; + } + body > header > nav #m-navbar-collapse li a { + line-height: 2.75rem; + } + body > header > nav a, body > header > nav #m-navbar-collapse li a { + margin-left: 0; + padding-left: 1rem; + padding-right: 1rem; + white-space: nowrap; + } + body > header > nav #m-navbar-collapse { + padding-bottom: 0; + } + body > header > nav #m-navbar-collapse li ol { + background-color: #22272e; + } + body > header > nav #m-navbar-collapse ol ol li { + margin-left: 0; + padding-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse ol ol li a { + padding-left: 0.75rem; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li { + margin-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li > a { + border-width: 0 0 0.25rem 0; + } + body > header > nav #m-navbar-collapse ol { + padding-left: 0; + padding-right: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { + float: left; + } + body > header > nav #m-navbar-collapse ol ol { + z-index: 99999; + position: absolute; + visibility: hidden; + } + body > header > nav #m-navbar-collapse li:hover ol { + visibility: visible; + } } -div.m-button.m-success a:hover, div.m-button.m-success a:focus, div.m-button.m-success a:active { - background-color: #acecbe; +body > footer { + width: 100%; } -div.m-button.m-warning a:hover, div.m-button.m-warning a:focus, div.m-button.m-warning a:active { - background-color: #e9ecae; +body > footer > nav { + padding-top: 1rem; + padding-bottom: 1rem; + font-size: 0.85rem; + text-align: center; + color: #c5c5c5; + background-color: #444e5c; } -div.m-button.m-danger a:hover, div.m-button.m-danger a:focus, div.m-button.m-danger a:active { - background-color: #ff9391; +body > footer > nav h3, body > footer > nav h3 a { + text-transform: uppercase; + font-weight: normal; } -div.m-button.m-info a:hover, div.m-button.m-info a:focus, div.m-button.m-info a:active { - background-color: #5297d7; +body > footer > nav ul { + list-style-type: none; + padding: 0; + margin: 0; } -div.m-button.m-dim a:hover, div.m-button.m-dim a:focus, div.m-button.m-dim a:active { - background-color: #acacac; +body > footer > nav a { + text-decoration: none; + text-transform: none; + color: #ffffff; } -img.m-image, svg.m-image { - display: block; - margin-left: auto; - margin-right: auto; +body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { + color: #a5c9ea; } -div.m-image { - text-align: center; +body > main { + padding-top: 1rem; + padding-bottom: 1rem; } -img.m-image, svg.m-image, div.m-image img { - max-width: 100%; - border-radius: 0.2rem; +article h1 { + font-size: 1.75rem; } -div.m-image.m-fullwidth img, div.m-image.m-fullwidth svg { - width: 100%; +article h1 .m-breadcrumb { + color: #747474; + font-weight: normal; } -figure.m-figure { - max-width: 100%; - margin-top: 0; - margin-left: auto; - margin-right: auto; - position: relative; - display: table; +article h1 .m-breadcrumb a { + color: #a5c9ea; } -figure.m-figure:before { - position: absolute; - content: ' '; - top: 0; - bottom: 0; - left: 0; - right: 0; - z-index: -1; - border-style: solid; - border-width: 0.125rem; - border-radius: 0.2rem; - border-color: #405363; +article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { + color: #dcdcdc; } -figure.m-figure.m-flat:before { - border-color: transparent; +article > header h1 { + font-size: 2rem; + margin-bottom: 0.5rem; } -figure.m-figure > * { - margin-left: 1rem; - margin-right: 1rem; - display: table-caption; - caption-side: bottom; +article h1 a, article > header h1, article > header h1 a, +article section > h2, article section > h2 a, +article section > h3, article section > h3 a, +article section > h4, article section > h4 a, +article section > h5, article section > h5 a, +article section > h6, article section > h6 a { + color: #a5c9ea; } -figure.m-figure > *:first-child { - display: inline; +article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, +article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, +article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, +article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, +article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, +article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { + color: #dcdcdc; } -figure.m-figure > *:last-child { - margin-bottom: 1rem; +article > header .m-date { + display: block; + width: 2.5rem; + float: left; + text-align: center; + line-height: 95%; + font-size: 0.75rem; + font-weight: normal; + white-space: nowrap; + border-right-style: solid; + border-right-width: 0.125rem; + border-color: #a5c9ea; + padding-right: 0.75rem; + margin-top: -0.1rem; + margin-right: 0.75rem; + margin-bottom: 0.25rem; } -figure.m-figure img { - position: relative; - margin-left: 0; - margin-right: 0; - margin-bottom: 0; - border-top-left-radius: 0.2rem; - border-top-right-radius: 0.2rem; - max-width: 100%; +article > header .m-date-day { + display: block; + font-weight: bold; + padding-top: 0.2rem; + padding-bottom: 0.15rem; + font-size: 1.25rem; } -figure.m-figure.m-flat img { - border-bottom-left-radius: 0.2rem; - border-bottom-right-radius: 0.2rem; +article > header p { + color: #f0f0f0; + font-size: 1.125rem; } -figure.m-figure figcaption { - margin-top: 0.5rem; - margin-bottom: 0.5rem; - font-weight: bold; - font-size: 1.17rem; +article > header h1::after { + content: " "; + clear: both; + display: table; } -figure.m-figure a img { - margin-left: -1rem; - margin-right: -1rem; +article > footer { + color: #c5c5c5; } -figure.m-figure.m-fullwidth, figure.m-figure.m-fullwidth > * { - display: block; +article > footer p { + font-style: italic; + font-size: 0.85rem; + text-indent: 0; } -figure.m-figure.m-fullwidth > *:first-child { - display: inline; +article section:target { + margin-left: -1.0rem; + border-left-style: solid; + border-left-width: 0.25rem; + padding-left: 0.75rem; + border-color: #a5c9ea; } -figure.m-figure.m-fullwidth img { - width: 100%; +article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, +article section > h4 a, article section > h5 a, article section > h6 a { + text-decoration: none; } -figure.m-figure.m-fullwidth:after { - content: ' '; - display: block; - margin-top: 1rem; - height: 1px; +#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { + background-size: cover; + background-color: #0f1217; + background-position: center center; + background-repeat: no-repeat; + margin-top: -4rem; + padding-top: 5rem; } -figure.m-code-figure, figure.m-console-figure { - margin-top: 0; - margin-left: 0; - margin-right: 0; - position: relative; - padding: 1rem; +#m-landing-image { + color: #ffffff; } -figure.m-code-figure:before, figure.m-console-figure:before { - position: absolute; - content: ' '; - top: 0; - bottom: 0; - left: 0; - right: 0; - z-index: -1; - border-style: solid; - border-width: 0.125rem; - border-radius: 0.2rem; +#m-cover-image { + height: 30rem; + margin-bottom: -26rem; } -figure.m-code-figure:before { - border-color: #282e36; +#m-landing-cover h1 { + font-size: 2.8rem; + margin-top: -0.5rem; + padding-left: 1.5rem; + padding-bottom: 1rem; + text-transform: lowercase; } -figure.m-console-figure:before { - border-color: #000000; +#m-landing-cover { + padding-bottom: 10rem; + margin-bottom: -6rem; } -figure.m-code-figure.m-flat:before, figure.m-console-figure.m-flat:before { - border-color: transparent; +article#m-jumbo { + margin-top: -1rem; } -figure.m-code-figure > pre:first-child, figure.m-console-figure > pre:first-child { - position: relative; - margin: -1rem -1rem 1rem -1rem; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; +#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { + background: linear-gradient(transparent 0%, transparent 50%, #2f363f 100%); + width: 100%; + height: 100%; } -article section:target figure.m-code-figure, article section:target figure.m-console-figure { - z-index: 1; +article#m-jumbo > header h1, article#m-jumbo > header h2 { + text-align: center; + font-weight: bold; } -figure.m-figure.m-default:before { border-color: #34424d; } -figure.m-figure.m-default figcaption { color: #dcdcdc; } -figure.m-figure.m-primary:before { border-color: #a5c2db; } -figure.m-figure.m-primary figcaption { color: #a5c9ea; } -figure.m-figure.m-success:before { border-color: #2a703f; } -figure.m-figure.m-success figcaption { color: #3bd267; } -figure.m-figure.m-warning:before { border-color: #6d702a; } -figure.m-figure.m-warning figcaption { color: #c7cf2f; } -figure.m-figure.m-danger:before { border-color: #702b2a; } -figure.m-figure.m-danger figcaption { color: #cd3431; } -figure.m-figure.m-info:before { border-color: #2a4f70; } -figure.m-figure.m-info figcaption { color: #2f83cc; } -figure.m-figure.m-dim:before { border-color: #2d3236; } -figure.m-figure.m-dim { color: #747474; } -figure.m-figure.m-dim a { color: #acacac; } -figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m-dim a:active { - color: #747474; +article#m-jumbo > header a { + text-decoration: none; } -.m-imagegrid > div { - background-color: #2f363f; /* to avoid section HL shining through */ +article#m-jumbo > header #m-jumbo-cover { + padding-bottom: 5rem; } -.m-imagegrid > div > figure { - display: block; - float: left; - position: relative; - margin: 0; +article#m-jumbo > header #m-jumbo-image { + font-size: 2.5vmin; + margin-bottom: -3rem; } -.m-imagegrid > div > figure > div, -.m-imagegrid > div > figure > figcaption, -.m-imagegrid > div > figure > a > div, -.m-imagegrid > div > figure > a > figcaption { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - border-color: #2f363f; - border-style: solid; - border-width: 0.25rem; - padding: 0.5rem; +article#m-jumbo > header h1 { + font-size: 10vmin; } -.m-imagegrid > div > figure:first-child > div, -.m-imagegrid > div > figure:first-child > figcaption, -.m-imagegrid > div > figure:first-child > a > div, -.m-imagegrid > div > figure:first-child > a > figcaption { - border-left-width: 0; +article#m-jumbo > header h2 { + font-size: 3vmin; } -.m-imagegrid > div > figure:last-child > div, -.m-imagegrid > div > figure:last-child > figcaption, -.m-imagegrid > div > figure:last-child > a > div, -.m-imagegrid > div > figure:last-child > a > figcaption { - border-right-width: 0; +@media screen and (max-height: 640px) , screen and (max-width: 640px) { + article#m-jumbo > header h1 { + font-size: 3rem; + } + article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { + font-size: 1rem; + } } -.m-imagegrid > div > figure > figcaption, -.m-imagegrid > div > figure > a > figcaption { - color: transparent; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - font-size: 0.75rem; +article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { + color: #ffffff; } -.m-imagegrid > div > figure > div::before, -.m-imagegrid > div > figure > figcaption::before, -.m-imagegrid > div > figure > a > div::before, -.m-imagegrid > div > figure > a > figcaption::before { - content: ''; +article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { + color: #f0f0f0; +} +article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { + color: #000000; +} +article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { + color: #0f0f0f; +} +.m-landing-news h3 a { + color: #dcdcdc; + text-decoration: none; + text-transform: uppercase; +} +.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { + color: #a5c9ea; +} +.m-landing-news time { display: inline-block; - height: 100%; - vertical-align: bottom; - width: 0; + margin-left: 1rem; + float: right; } -.m-imagegrid > div > figure:hover > figcaption, -.m-imagegrid > div > figure:hover > a > figcaption { - background: linear-gradient(transparent 0%, transparent 75%, rgba(0, 0, 0, 0.85) 100%); - color: #ffffff; +.m-article-pagination { + text-align: center; + padding: 1rem; } -.m-imagegrid > div > figure > img, -.m-imagegrid > div > figure > a > img { - width: 100%; - height: 100%; +nav.m-navpanel { + text-align: center; } -.m-imagegrid > div::after { - display: block; - content: ' '; - clear: both; +nav.m-navpanel h3 { + text-transform: uppercase; + font-weight: normal; } -@media screen and (max-width: 767px) { - .m-imagegrid > div > figure { - float: none; - width: 100% !important; - } - .m-imagegrid > div > figure > div, - .m-imagegrid > div > figure > figcaption, - .m-imagegrid > div > figure > a > div, - .m-imagegrid > div > figure > a > figcaption { - border-left-width: 0; - border-right-width: 0; - } +nav.m-navpanel ol { + text-transform: lowercase; } -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-note, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-frame, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-block, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-imagegrid, -.m-container-inflatable > .m-row > [class*='m-col-'] > pre, -.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-code-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-console-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-note, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-frame, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-block, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-imagegrid, -.m-container-inflatable > .m-row > [class*='m-col-'] section > pre, -.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-code-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-console-figure { - margin-left: -1rem; - margin-right: -1rem; +nav.m-navpanel ol, nav.m-navpanel ul { + list-style-type: none; + padding: 0; } -@media screen and (min-width: 576px) { - .m-container-inflatable > .m-row > .m-col-s-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-s-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +nav.m-navpanel a { + color: #ffffff; + text-decoration: none; } -@media screen and (min-width: 768px) { - .m-container-inflatable > .m-row > .m-col-m-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-m-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { + color: #a5c9ea; } -@media screen and (min-width: 992px) { - .m-container-inflatable > .m-row > .m-col-l-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-l-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +ul.m-tagcloud li { display: inline; } +ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } +ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } +ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } +ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } +ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } +article section:target figure.m-code-figure, article section:target figure.m-console-figure { + z-index: 1; } +article, article > header, article section { margin-bottom: 1rem; } +article:last-child, article section:last-child { margin-bottom: 0; } .m-container-inflatable section:target > .m-note, .m-container-inflatable section:target > .m-frame, .m-container-inflatable section:target > .m-block, @@ -1720,101 +1815,6 @@ figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m- .m-container-inflatable section:target section > .m-note.m-dim { border-left-color: #747474; } -pre.m-code span.hll { - margin-left: -1.0rem; - margin-right: -1.0rem; - padding-left: 1.0rem; -} -pre.m-code.m-inverted { - color: rgba(230, 230, 230, 0.33); -} -pre.m-code.m-inverted > span { - opacity: 0.3333; -} -pre.m-code.m-inverted > span.hll { - color: #dcdcdc; - opacity: 1; - background-color: transparent; - border-color: transparent; -} -div.m-math { - overflow-x: auto; - overflow-y: hidden; - text-align: center; -} -div.m-plot svg { - text-align: center; -} -div.m-plot .m-background { - fill: #34424d; -} -div.m-plot svg .m-label { font-size: 11px; } -div.m-plot svg .m-title { font-size: 13px; } -div.m-plot svg .m-label, div.m-plot svg .m-title { fill: #dcdcdc; } -div.m-plot svg .m-line { - stroke: #dcdcdc; - stroke-width: 0.8; -} -div.m-plot svg .m-error { - stroke: #ffffff; - stroke-width: 1.5; -} -div.m-plot svg .m-label.m-dim { fill: #747474; } -div.m-math svg, svg.m-math { fill: #dcdcdc; } -div.m-math.m-default svg, svg.m-math.m-default, div.m-plot svg .m-bar.m-default { - fill: #dcdcdc; -} -div.m-math.m-primary svg, svg.m-math.m-primary, div.m-plot svg .m-bar.m-primary { - fill: #a5c9ea; -} -div.m-math.m-success svg, svg.m-math.m-success, div.m-plot svg .m-bar.m-success { - fill: #3bd267; -} -div.m-math.m-warning svg, svg.m-math.m-warning, div.m-plot svg .m-bar.m-warning { - fill: #c7cf2f; -} -div.m-math.m-danger svg, svg.m-math.m-danger, div.m-plot svg .m-bar.m-danger { - fill: #cd3431; -} -div.m-math.m-info svg, svg.m-math.m-info, div.m-plot svg .m-bar.m-info { - fill: #2f83cc; -} -div.m-math.m-dim svg, svg.m-math.m-dim, div.m-plot svg .m-bar.m-dim { - fill: #747474; -} -p, ul, ol, dl, blockquote, pre, figure.m-code-figure, figure.m-console-figure, -hr, article, article > header, article section, -.m-note, .m-frame, .m-block, div.m-button, -div.m-scroll, table.m-table, div.m-image, img.m-image, svg.m-image, -figure.m-figure, .m-imagegrid, div.m-math { - margin-bottom: 1rem; -} -p:last-child, ul:last-child, ol:last-child, dl:last-child, blockquote:last-child, -pre:last-child, figure.m-code-figure:last-child, figure.m-console-figure:last-child, -hr:last-child, article:last-child, article section:last-child, -.m-note:last-child, .m-frame:last-child, .m-block:last-child, -div.m-button:last-child, div.m-scroll:last-child, table.m-table:last-child, -img.m-image:last-child, svg.m-image:last-child, div.m-image:last-child, -figure.m-figure:last-child, .m-imagegrid:last-child, div.m-math:last-child { - margin-bottom: 0; -} -li > p:last-child, li > blockquote:last-child, li > pre:last-child, -li > figure.m-code-figure:last-child, li > figure.m-console-figure:last-child, -li > .m-note:last-child, li > .m-frame:last-child, li > .m-block:last-child, -li > div.m-button:last-child, li > div.m-scroll:last-child, li > table.m-table:last-child, -li > img.m-image:last-child, li > svg.m-image:last-child, li > div.m-image:last-child, -li > figure.m-figure:last-child, li > div.m-math:last-child { - margin-bottom: 1rem; -} -li:last-child > p:last-child, li:last-child > blockquote:last-child, li:last-child > pre:last-child, -li:last-child > figure.m-code-figure:last-child, li:last-child > figure.m-console-figure:last-child, -li:last-child > .m-note:last-child, li:last-child > .m-frame:last-child, li:last-child > .m-block:last-child, -li:last-child > div.m-button:last-child, li:last-child > div.m-scroll:last-child, -li:last-child > table.m-table:last-child, li:last-child > img.m-image:last-child, -li:last-child > svg.m-image:last-child, li:last-child > div.m-image:last-child, -li:last-child > figure.m-figure:last-child, li:last-child > div.m-math:last-child { - margin-bottom: 0; -} .m-code .hll { background-color: #34424d } .m-code .c { color: #a5c9ea } diff --git a/css/m-dark.css b/css/m-dark.css index 5f9bacea..42059152 100644 --- a/css/m-dark.css +++ b/css/m-dark.css @@ -22,135 +22,11 @@ DEALINGS IN THE SOFTWARE. */ +@import url('m-theme-dark.css'); @import url('m-grid.css'); @import url('m-components.css'); +@import url('m-layout.css'); @import url('pygments-dark.css'); @import url('pygments-console.css'); -:root { - /* Text properties */ - --font: 'Source Sans Pro', sans-serif; - --code-font: 'Source Code Pro', monospace; - --font-size: 16px; - --paragraph-indent: 1.5rem; - --paragraph-align: justify; - --link-decoration: underline; - --link-decoration-nav: none; - --link-decoration-heading: none; - --nav-brand-case: uppercase; - --nav-menu-case: none; - --nav-heading-case: uppercase; - --nav-categories-case: lowercase; - --landing-header-case: lowercase; - --heading-font-weight: bold; - - /* Shapes */ - --border-radius: 0.2rem; - - /* Basics */ - --background-color: #2f363f; - --color: #dcdcdc; - --line-color: #405363; - --link-color: #5b9dd9; - --link-active-color: #a5c9ea; - --mark-color: #2f83cc; - --mark-background-color: #c7cf2f; - --code-color: #e6e6e6; - --code-inverted-color: rgba(230, 230, 230, 0.33); - /* This is simply color-picked --code-note-background-color on top of - --background-color */ - --code-background-color: #282e36; - --code-note-background-color: rgba(34, 39, 46, 0.5); - --console-background-color: #000000; - --button-background-color: #22272e; - - /* Header */ - --header-border-width: 0 0 0.25rem 0; - --header-color: #ffffff; - --header-background-color: #22272e; - --header-background-color-landing: rgba(34, 39, 46, 0.75); - --header-background-color-jumbo: rgba(34, 39, 46, 0.25); - --header-link-color: #ffffff; - --header-link-active-color: #a5c9ea; - --header-link-current-color: #5b9dd9; - --header-link-active-background-color: #292f37; - --header-link-active-background-color-semi: rgba(41, 47, 55, 0.5); - - /* Footer */ - --footer-font-size: 0.85rem; - --footer-color: #c5c5c5; - --footer-background-color: #444e5c; - --footer-link-color: #ffffff; - --footer-link-active-color: #a5c9ea; - - /* Cover image */ - --cover-image-background-color: #0f1217; - - /* Article */ - --article-header-color: #f0f0f0; - --article-footer-color: #c5c5c5; - --article-heading-color: #a5c9ea; - --article-heading-active-color: #dcdcdc; - - /* Right navigation panel */ - --navpanel-link-color: #ffffff; - --navpanel-link-active-color: #a5c9ea; - - /* Plots */ - --plot-background-color: #34424d; - --plot-error-color: #ffffff; - - /* Colored components */ - --default-color: #dcdcdc; - --default-filled-color: #dcdcdc; - --default-filled-background-color: #34424d; - --default-filled-link-color: #5b9dd9; - --default-filled-link-active-color: #a5c9ea; - --default-button-active-color: #a5c9ea; - - --primary-color: #a5c9ea; - --primary-filled-color: #2f363f; - --primary-filled-background-color: #a5c2db; - --primary-filled-link-color: #2a75b6; - --primary-filled-link-active-color: #2f363f; - --primary-button-active-color: #dcdcdc; - - --success-color: #3bd267; - --success-filled-color: #acecbe; - --success-filled-background-color: #2a703f; - --success-filled-link-color: #3bd267; - --success-filled-link-active-color: #acecbe; - --success-button-active-color: #acecbe; - - --warning-color: #c7cf2f; - --warning-filled-color: #e9ecae; - --warning-filled-background-color: #6d702a; - --warning-filled-link-color: #b8bf2b; - --warning-filled-link-active-color: #e9ecae; - --warning-button-active-color: #e9ecae; - - --danger-color: #cd3431; - --danger-filled-color: #ff9391; - --danger-filled-background-color: #702b2a; - --danger-filled-link-color: #d85c59; - --danger-filled-link-active-color: #ff9391; - --danger-button-active-color: #ff9391; - - --info-color: #2f83cc; - --info-filled-color: #a5caeb; - --info-filled-background-color: #2a4f70; - --info-filled-link-color: #5297d7; - --info-filled-link-active-color: #a5caeb; - --info-button-active-color: #5297d7; - - --dim-color: #747474; - --dim-link-color: #acacac; - --dim-link-active-color: #747474; - --dim-filled-color: #747474; - --dim-filled-background-color: #2d3236; - --dim-filled-link-color: #acacac; - --dim-filled-link-active-color: #747474; - --dim-button-active-color: #acacac; -} - /* kate: indent-width 2; */ diff --git a/css/m-dark.doxygen.compiled.css b/css/m-dark.doxygen.compiled.css index bed13779..a2f649ae 100644 --- a/css/m-dark.doxygen.compiled.css +++ b/css/m-dark.doxygen.compiled.css @@ -1,4 +1,4 @@ -/* Generated using `./postprocess.py m-dark.css m-doxygen.css --no-import -o m-dark.doxygen.compiled.css`. Do not edit. */ +/* Generated using `./postprocess.py m-dark.css m-theme-dark.css m-doxygen.css --no-import -o m-dark.doxygen.compiled.css`. Do not edit. */ /* This file is part of m.css. diff --git a/css/m-layout.css b/css/m-layout.css new file mode 100644 index 00000000..29b98a1c --- /dev/null +++ b/css/m-layout.css @@ -0,0 +1,542 @@ +/* + This file is part of m.css. + + Copyright © 2017, 2018 Vladimír Vondruš + + Permission is hereby granted, free of charge, to any person obtaining a + copy of this software and associated documentation files (the "Software"), + to deal in the Software without restriction, including without limitation + the rights to use, copy, modify, merge, publish, distribute, sublicense, + and/or sell copies of the Software, and to permit persons to whom the + Software is furnished to do so, subject to the following conditions: + + The above copyright notice and this permission notice shall be included + in all copies or substantial portions of the Software. + + THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL + THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING + FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER + DEALINGS IN THE SOFTWARE. +*/ + +/* Header navigation */ +body > header > nav { + width: 100%; + background-color: var(--header-background-color); + min-height: 3rem; +} +body > header > nav.m-navbar-landing, +body > header > nav.m-navbar-cover { + background-color: transparent; + position: relative; +} +body > header > nav.m-navbar-landing { + opacity: 0.8; +} +body > header > nav.m-navbar-cover { + background-color: var(--header-background-color-jumbo); + opacity: 1; +} +body > header > nav.m-navbar-landing:hover, +body > header > nav.m-navbar-cover:hover { + background-color: var(--header-background-color-landing); + opacity: 1; +} +body> header > nav.m-navbar-landing:target, +body> header > nav.m-navbar-cover:target { + background-color: var(--header-background-color); + opacity: 1; +} +body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { + visibility: hidden; +} +body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { + visibility: visible; +} +body > header > nav { + margin-left: auto; + margin-right: auto; + color: var(--header-color); +} +body > header > nav a { + text-decoration: var(--link-decoration-nav); + text-transform: var(--nav-menu-case); + display: inline-block; + vertical-align: middle; + line-height: 2.75rem; + color: var(--header-link-color); +} +body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { + text-transform: var(--nav-brand-case); + font-weight: var(--heading-font-weight); + font-size: 1.125rem; + padding-left: 1rem; + padding-right: 1rem; +} +body > header > nav a#m-navbar-brand .m-thin { + font-weight: normal; +} +body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { + content:'\2630'; +} +body > header > nav #m-navbar-collapse { + padding-bottom: 1rem; +} +body > header > nav #m-navbar-collapse li { + border-style: solid; + border-color: transparent; + border-width: 0 0 0 0.25rem; + margin-left: -1rem; +} +body > header > nav #m-navbar-collapse li a { + border-style: solid; + border-color: transparent; + line-height: 1.5rem; + margin-left: -0.25rem; + padding-left: 0.75rem; + border-width: 0 0 0 0.25rem; + width: 100%; +} +body > header > nav #m-navbar-collapse li a#m-navbar-current { + color: var(--header-link-current-color); + border-color: var(--header-link-current-color); +} +body > header > nav ol { + list-style-type: none; + margin: 0; +} +body > header > nav ol ol { + padding-left: 1.5rem; +} +body > header > nav [class*='m-col-'] { + padding-top: 0; + padding-bottom: 0; +} +body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { + color: var(--header-link-active-color); +} +body > header > nav #m-navbar-collapse li:hover { + border-color: var(--header-link-active-color); +} +body > header > nav #m-navbar-collapse li a:hover, +body > header > nav #m-navbar-collapse li a:focus, +body > header > nav #m-navbar-collapse li a:active { + border-color: var(--header-link-active-color); + background-color: var(--header-link-active-background-color); +} +body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { + background-color: var(--header-link-active-background-color-semi); +} + +/* Header navigation -- collapsible part */ +body > header > nav #m-navbar-hide { + display: none; +} +body > header > nav:target #m-navbar-collapse { + display: block; +} +body > header > nav:target #m-navbar-show { + display: none; +} +body > header > nav:target #m-navbar-hide { + display: inline-block; +} + +/* Header navigation -- 768px and up (tablets, desktops) */ +@media screen and (min-width: 768px) { + body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, + body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { + display: none; + } + body > header > nav #m-navbar-collapse li a { + line-height: 2.75rem; + } + body > header > nav a, body > header > nav #m-navbar-collapse li a { + margin-left: 0; + padding-left: 1rem; + padding-right: 1rem; + white-space: nowrap; + } + body > header > nav #m-navbar-collapse { + padding-bottom: 0; + } + body > header > nav #m-navbar-collapse li ol { + background-color: var(--header-background-color); + } + body > header > nav #m-navbar-collapse ol ol li { + margin-left: 0; + padding-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse ol ol li a { + padding-left: 0.75rem; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li { + margin-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li > a { + border-width: var(--header-border-width); + } + body > header > nav #m-navbar-collapse ol { + padding-left: 0; + padding-right: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { + float: left; + } + body > header > nav #m-navbar-collapse ol ol { + z-index: 99999; + position: absolute; + visibility: hidden; + } + body > header > nav #m-navbar-collapse li:hover ol { + visibility: visible; + } +} + +/* Footer navigation */ +body > footer { + width: 100%; +} +body > footer > nav { + padding-top: 1rem; + padding-bottom: 1rem; + font-size: var(--footer-font-size); + text-align: center; + color: var(--footer-color); + background-color: var(--footer-background-color); +} +body > footer > nav h3, body > footer > nav h3 a { + text-transform: var(--nav-heading-case); + font-weight: normal; +} +body > footer > nav ul { + list-style-type: none; + padding: 0; + margin: 0; +} +body > footer > nav a { + text-decoration: var(--link-decoration-nav); + text-transform: var(--nav-menu-case); + color: var(--footer-link-color); +} +body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { + color: var(--footer-link-active-color); +} + +/* Main content */ +body > main { + padding-top: 1rem; + padding-bottom: 1rem; +} + +/* Page heading (not in
), breadcrumb naviation on pages */ +article h1 { + font-size: 1.75rem; +} +article h1 .m-breadcrumb { + color: var(--dim-color); + font-weight: normal; +} +article h1 .m-breadcrumb a { + color: var(--article-heading-color); +} +article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { + color: var(--article-heading-active-color); +} + +/* Article elements */ +article > header h1 { + font-size: 2rem; + margin-bottom: 0.5rem; +} +article h1 a, article > header h1, article > header h1 a, +article section > h2, article section > h2 a, +article section > h3, article section > h3 a, +article section > h4, article section > h4 a, +article section > h5, article section > h5 a, +article section > h6, article section > h6 a { + color: var(--article-heading-color); +} +article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, +article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, +article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, +article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, +article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, +article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { + color: var(--article-heading-active-color); +} +article > header .m-date { + display: block; + width: 2.5rem; + float: left; + text-align: center; + line-height: 95%; + font-size: 0.75rem; + font-weight: normal; + white-space: nowrap; + border-right-style: solid; + border-right-width: 0.125rem; + border-color: var(--article-heading-color); + padding-right: 0.75rem; + margin-top: -0.1rem; + margin-right: 0.75rem; + margin-bottom: 0.25rem; +} +article > header .m-date-day { + display: block; + font-weight: bold; + padding-top: 0.2rem; + padding-bottom: 0.15rem; + font-size: 1.25rem; +} +article > header p { + color: var(--article-header-color); + font-size: 1.125rem; +} +article > header h1::after { + content: " "; + clear: both; + display: table; +} +article > footer { + color: var(--article-footer-color); +} +article > footer p { + font-style: italic; + font-size: 0.85rem; + text-indent: 0; +} + +/* Article -- dynamic section headers */ +article section:target { + margin-left: -1.0rem; + border-left-style: solid; + border-left-width: 0.25rem; + padding-left: 0.75rem; + border-color: var(--article-heading-color); +} +article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, +article section > h4 a, article section > h5 a, article section > h6 a { + text-decoration: var(--link-decoration-heading); +} + +/* Landing page, jumbo article */ +#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { + background-size: cover; + background-color: var(--cover-image-background-color); + background-position: center center; + background-repeat: no-repeat; + margin-top: -4rem; + padding-top: 5rem; +} +#m-landing-image { + color: #ffffff; +} +#m-cover-image { + height: 30rem; + margin-bottom: -26rem; +} +#m-landing-cover h1 { + font-size: 2.8rem; + margin-top: -0.5rem; + padding-left: var(--paragraph-indent); + padding-bottom: 1rem; + text-transform: var(--landing-header-case); +} +#m-landing-cover { + padding-bottom: 10rem; + margin-bottom: -6rem; +} +article#m-jumbo { + margin-top: -1rem; +} +#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { + background: linear-gradient(transparent 0%, transparent 50%, var(--background-color) 100%); + width: 100%; + height: 100%; +} +article#m-jumbo > header h1, article#m-jumbo > header h2 { + text-align: center; + font-weight: bold; +} +article#m-jumbo > header a { + text-decoration: none; +} +article#m-jumbo > header #m-jumbo-cover { + padding-bottom: 5rem; +} +article#m-jumbo > header #m-jumbo-image { + font-size: 2.5vmin; + margin-bottom: -3rem; +} +article#m-jumbo > header h1 { + font-size: 10vmin; +} +article#m-jumbo > header h2 { + font-size: 3vmin; +} +/* 2.5vmin equals to 16px (= 1 rem) on 640px, use that as the lower limit */ +@media screen and (max-height: 640px) , screen and (max-width: 640px) { + article#m-jumbo > header h1 { + font-size: 3rem; + } + article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { + font-size: 1rem; + } +} + +article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { + color: #ffffff; +} +article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { + color: #f0f0f0; +} + +article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { + color: #000000; +} +article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { + color: #0f0f0f; +} + +/* News list on landing pages */ +.m-landing-news h3 a { + color: var(--color); + text-decoration: none; + text-transform: var(--nav-heading-case); +} +.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { + color: var(--article-heading-color); +} +.m-landing-news time { + display: inline-block; + margin-left: 1rem; + float: right; +} + +/* Article pagination */ +.m-article-pagination { + text-align: center; + padding: 1rem; +} + +/* Right navigation panel */ +nav.m-navpanel { + text-align: center; +} +nav.m-navpanel h3 { + text-transform: var(--nav-heading-case); + font-weight: normal; +} +nav.m-navpanel ol { + text-transform: var(--nav-categories-case); +} +nav.m-navpanel ol, nav.m-navpanel ul { + list-style-type: none; + padding: 0; +} +nav.m-navpanel a { + color: var(--navpanel-link-color); + text-decoration: var(--link-decoration-nav); +} +nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { + color: var(--navpanel-link-active-color); +} + +/* Tag cloud */ +ul.m-tagcloud li { display: inline; } +ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } +ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } +ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } +ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } +ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } + +/* Avoid selection border being above figure border */ +article section:target figure.m-code-figure, article section:target figure.m-console-figure { + z-index: 1; +} + +/* Spacing after every block element, but not after the last */ +article, article > header, article section { margin-bottom: 1rem; } +article:last-child, article section:last-child { margin-bottom: 0; } + +/* Active sections in inflatable content affect left border of some components */ +.m-container-inflatable section:target > .m-note, +.m-container-inflatable section:target > .m-frame, +.m-container-inflatable section:target > .m-block, +.m-container-inflatable section:target > pre, +.m-container-inflatable section:target > figure.m-code-figure > pre:first-child, +.m-container-inflatable section:target > figure.m-console-figure > pre:first-child, +.m-container-inflatable section:target section > .m-note, +.m-container-inflatable section:target section > .m-frame, +.m-container-inflatable section:target section > .m-block, +.m-container-inflatable section:target section > pre, +.m-container-inflatable section:target section > figure.m-code-figure > pre:first-child, +.m-container-inflatable section:target section > figure.m-console-figure > pre:first-child { + margin-left: -1.0rem; + border-left-style: solid; + border-left-width: 0.25rem; + border-top-left-radius: 0; + border-bottom-left-radius: 0; + padding-left: 0.75rem; +} +.m-container-inflatable section:target > figure.m-code-figure::before, +.m-container-inflatable section:target > figure.m-console-figure::before, +.m-container-inflatable section:target section > figure.m-code-figure::before, +.m-container-inflatable section:target section > figure.m-console-figure::before { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + border-left-width: 0.25rem; +} +.m-container-inflatable section:target > pre, +.m-container-inflatable section:target > figure.m-code-figure > pre:first-child, +.m-container-inflatable section:target > figure.m-console-figure > pre:first-child, +.m-container-inflatable section:target section > pre, +.m-container-inflatable section:target section > figure.m-code-figure > pre:first-child, +.m-container-inflatable section:target section > figure.m-console-figure > pre:first-child { + border-color: var(--line-color); +} +.m-container-inflatable section:target > figure.m-code-figure::before, +.m-container-inflatable section:target > figure.m-console-figure::before, +.m-container-inflatable section:target > .m-note.m-default, +.m-container-inflatable section:target section > figure.m-code-figure::before, +.m-container-inflatable section:target section > figure.m-console-figure::before, +.m-container-inflatable section:target section > .m-note.m-default { + border-left-color: var(--line-color); +} +.m-container-inflatable section:target > .m-note.m-primary, +.m-container-inflatable section:target section > .m-note.m-primary { + border-left-color: var(--primary-color); +} +.m-container-inflatable section:target > .m-note.m-success, +.m-container-inflatable section:target section > .m-note.m-success { + border-left-color: var(--success-color); +} +.m-container-inflatable section:target > .m-note.m-warning, +.m-container-inflatable section:target section > .m-note.m-warning { + border-left-color: var(--warning-color); +} +.m-container-inflatable section:target > .m-note.m-danger, +.m-container-inflatable section:target section > .m-note.m-danger { + border-left-color: var(--danger-color); +} +.m-container-inflatable section:target > .m-note.m-info, +.m-container-inflatable section:target section > .m-note.m-info { + border-left-color: var(--info-color); +} +.m-container-inflatable section:target > .m-note.m-dim, +.m-container-inflatable section:target section > .m-note.m-dim { + border-left-color: var(--dim-color); +} + +/* kate: indent-width 2; */ diff --git a/css/m-light+doxygen.compiled.css b/css/m-light+doxygen.compiled.css index c58d2bd2..ec48a040 100644 --- a/css/m-light+doxygen.compiled.css +++ b/css/m-light+doxygen.compiled.css @@ -487,1172 +487,1267 @@ code { code.m-console { background-color: #000000; } -body > header > nav { +div.m-scroll { + max-width: 100%; + overflow-x: auto; +} +.m-fullwidth { width: 100%; - background-color: #ffffff; - min-height: 3rem; } -body > header > nav.m-navbar-landing, -body > header > nav.m-navbar-cover { - background-color: transparent; - position: relative; +.m-text-center, .m-text-center.m-noindent, table.m-table th.m-text-center, .m-text-center p { + text-align: center; } -body > header > nav.m-navbar-landing { - opacity: 0.8; +.m-text-left, .m-text-left.m-noindent, table.m-table th.m-text-left, .m-text-right p { + text-align: left; } -body > header > nav.m-navbar-cover { - background-color: rgba(255, 255, 255, 0.25); - opacity: 1; +.m-text-right, .m-text-right.m-noindent, table.m-table th.m-text-right, .m-text-right p { + text-align: right; } -body > header > nav.m-navbar-landing:hover, -body > header > nav.m-navbar-cover:hover { - background-color: rgba(255, 255, 255, 0.75); - opacity: 1; +.m-text-top, table.m-table th.m-text-top, table.m-table td.m-text-top { + vertical-align: top; } -body> header > nav.m-navbar-landing:target, -body> header > nav.m-navbar-cover:target { - background-color: #ffffff; - opacity: 1; +.m-text-middle, table.m-table th.m-text-middle, table.m-table td.m-text-middle { + vertical-align: middle; } -body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { - visibility: hidden; +.m-text-bottom, table.m-table th.m-text-bottom, table.m-table td.m-text-bottom { + vertical-align: bottom; } -body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { - visibility: visible; +.m-text.m-small { + font-size: 85.4%; } -body > header > nav { - margin-left: auto; - margin-right: auto; - color: #000000; +.m-text.m-big { + font-size: 117%; } -body > header > nav a { - text-decoration: none; - text-transform: lowercase; - display: inline-block; - vertical-align: middle; - line-height: 2.75rem; - color: #000000; +.m-text.m-strong { + font-weight: bold; } -body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { - text-transform: lowercase; - font-weight: normal; - font-size: 1.125rem; - padding-left: 1rem; - padding-right: 1rem; +.m-text.m-em { + font-style: italic; } -body > header > nav a#m-navbar-brand .m-thin { +h1 .m-thin, h2 .m-thin, h3 .m-thin, h4 .m-thin, h5 .m-thin, h6 .m-thin { font-weight: normal; } -body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { - content:'\2630'; +ul.m-unstyled, ol.m-unstyled { + list-style-type: none; + padding-left: 0; } -body > header > nav #m-navbar-collapse { - padding-bottom: 1rem; +ul[class*='m-block-'], ol[class*='m-block-'] { + padding-left: 0; } -body > header > nav #m-navbar-collapse li { - border-style: solid; - border-color: transparent; - border-width: 0 0 0 0.25rem; - margin-left: -1rem; +ul[class*='m-block-'] li, ol[class*='m-block-'] li { + display: inline; } -body > header > nav #m-navbar-collapse li a { - border-style: solid; - border-color: transparent; - line-height: 1.5rem; - margin-left: -0.25rem; - padding-left: 0.75rem; - border-width: 0 0 0 0.25rem; - width: 100%; +ul[class*='m-block-bar-'] li:not(:last-child)::after, ol[class*='m-block-bar-'] li:not(:last-child)::after { + content: " | "; } -body > header > nav #m-navbar-collapse li a#m-navbar-current { - color: #ea7944; - border-color: #ea7944; +@media screen and (min-width: 576px) { + ul.m-block-bar-s, ol.m-block-bar-s { padding-left: 2rem; } + ul.m-block-bar-s li, ol.m-block-bar-s li { display: list-item; } + ul.m-block-bar-s li:not(:last-child)::after, ol.m-block-bar-s li:not(:last-child)::after { content: ""; } } -body > header > nav ol { - list-style-type: none; - margin: 0; +@media screen and (min-width: 768px) { + ul.m-block-bar-m, ol.m-block-bar-m { padding-left: 2rem; } + ul.m-block-bar-m li, ol.m-block-bar-m li { display: list-item; } + ul.m-block-bar-m li:not(:last-child)::after, ol.m-block-bar-m li:not(:last-child)::after { content: ""; } } -body > header > nav ol ol { - padding-left: 1.5rem; +@media screen and (min-width: 992px) { + ul.m-block-bar-l, ol.m-block-bar-l { padding-left: 2rem; } + ul.m-block-bar-l li, ol.m-block-bar-l li { display: list-item; } + ul.m-block-bar-l li:not(:last-child)::after, ol.m-block-bar-l li:not(:last-child)::after { content: ""; } } -body > header > nav [class*='m-col-'] { - padding-top: 0; - padding-bottom: 0; +p.m-poem { + text-indent: 0; + text-align: left; + margin-left: 1.5rem; } -body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { - color: #cb4b16; +p.m-transition { + color: #f7e3db; + text-indent: 0; + text-align: center; + font-size: 2rem; } -body > header > nav #m-navbar-collapse li:hover { - border-color: #cb4b16; +dl.m-diary { + margin-bottom: 1.25rem; } -body > header > nav #m-navbar-collapse li a:hover, -body > header > nav #m-navbar-collapse li a:focus, -body > header > nav #m-navbar-collapse li a:active { - border-color: #cb4b16; - background-color: rgba(255, 255, 255, 0.5); +dl.m-diary:last-child { + margin-bottom: 0.25rem; } -body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { - background-color: var(--header-link-active-background-color-semi); +dl.m-diary dt { + font-weight: bold; + width: 3.5rem; + float: left; + clear: both; + padding-top: 0.25rem; } -body > header > nav #m-navbar-hide { - display: none; +dl.m-diary dd { + padding-top: 0.25rem; + padding-left: 3.5rem; } -body > header > nav:target #m-navbar-collapse { - display: block; +.m-note { + border-radius: 0.2rem; + padding: 1rem; } -body > header > nav:target #m-navbar-show { - display: none; +.m-note pre, .m-note code { + background-color: rgba(251, 240, 236, 0.5); } -body > header > nav:target #m-navbar-hide { - display: inline-block; +.m-frame { + background-color: #ffffff; + border-style: solid; + border-width: 0.125rem; + border-radius: 0.2rem; + border-color: #f7e3db; + padding: 0.875rem; } -@media screen and (min-width: 768px) { - body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, - body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { - display: none; - } - body > header > nav #m-navbar-collapse li a { - line-height: 2.75rem; - } - body > header > nav a, body > header > nav #m-navbar-collapse li a { - margin-left: 0; - padding-left: 1rem; - padding-right: 1rem; - white-space: nowrap; - } - body > header > nav #m-navbar-collapse { - padding-bottom: 0; - } - body > header > nav #m-navbar-collapse li ol { - background-color: #ffffff; - } - body > header > nav #m-navbar-collapse ol ol li { - margin-left: 0; - padding-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse ol ol li a { - padding-left: 0.75rem; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li { - margin-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li > a { - border-width: 0.25rem 0 0 0; - } - body > header > nav #m-navbar-collapse ol { - padding-left: 0; - padding-right: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { - float: left; - } - body > header > nav #m-navbar-collapse ol ol { - z-index: 99999; - position: absolute; - visibility: hidden; - } - body > header > nav #m-navbar-collapse li:hover ol { - visibility: visible; - } +.m-block { + border-style: solid; + border-width: 0.0625rem; + border-left-width: 0.25rem; + border-radius: 0.2rem; + border-color: #f7e3db; + padding: 0.9375rem 0.9375rem 0.9375rem 0.75rem; } -body > footer { - width: 100%; +.m-block.m-badge::after { + content: ' '; + display: block; + clear: both; } -body > footer > nav { - padding-top: 1rem; - padding-bottom: 1rem; - font-size: 0.85rem; - text-align: center; - color: #7c7c7c; - background-color: #eeeeee; +.m-block.m-badge h3 { + margin-left: 5rem; } -body > footer > nav h3, body > footer > nav h3 a { - text-transform: uppercase; - font-weight: normal; +.m-block.m-badge p { + margin-left: 5rem; + text-indent: 0; } -body > footer > nav ul { - list-style-type: none; - padding: 0; - margin: 0; +.m-block.m-badge img { + width: 4rem; + height: 4rem; + border-radius: 2rem; + float: left; } -body > footer > nav a { +div.m-button { + text-align: center; +} +div.m-button a { + display: inline-block; + border-radius: 0.2rem; + padding-top: 0.75rem; + padding-bottom: 0.75rem; + padding-left: 1.5rem; + padding-right: 1.5rem; text-decoration: none; - text-transform: lowercase; - color: #191919; + font-size: 1.17rem; } -body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { - color: #494949; +div.m-button.m-fullwidth a { + display: block; + padding-left: 0.5rem; + padding-right: 0.5rem; } -body > main { - padding-top: 1rem; - padding-bottom: 1rem; +div.m-button a .m-big:first-child { + font-size: 1.37rem; + font-weight: bold; } -article h1 { - font-size: 1.75rem; +div.m-button a .m-small:last-child { + font-size: 0.854rem; } -article h1 .m-breadcrumb { - color: #bdbdbd; +.m-label { + border-radius: 0.2rem; + font-size: 75%; font-weight: normal; + padding: 0.125rem 0.25rem; + vertical-align: 7.5%; } -article h1 .m-breadcrumb a { - color: #cb4b16; +.m-label.m-flat { + border-width: 0.0625rem; + border-style: solid; + border-color: #bdbdbd; + padding: 0.0625rem 0.1875rem; } -article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { - color: #802f0e; +table.m-table { + border-collapse: collapse; + margin-left: auto; + margin-right: auto; } -article > header h1 { - font-size: 2rem; - margin-bottom: 0.5rem; +table.m-table.m-big { + margin-top: 1.75rem; } -article h1 a, article > header h1, article > header h1 a, -article section > h2, article section > h2 a, -article section > h3, article section > h3 a, -article section > h4, article section > h4 a, -article section > h5, article section > h5 a, -article section > h6, article section > h6 a { - color: #cb4b16; +div.m-scroll > table.m-table:last-child { + margin-bottom: 0.0625rem; } -article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, -article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, -article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, -article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, -article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, -article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { - color: #802f0e; +table.m-table:not(.m-flat) tbody tr:hover { + background-color: #f7e3db; } -article > header .m-date { - display: block; - width: 2.5rem; - float: left; - text-align: center; - line-height: 95%; - font-size: 0.75rem; - font-weight: normal; - white-space: nowrap; - border-right-style: solid; - border-right-width: 0.125rem; - border-color: #cb4b16; - padding-right: 0.75rem; - margin-top: -0.1rem; - margin-right: 0.75rem; - margin-bottom: 0.25rem; +table.m-table th, table.m-table td { + vertical-align: top; + border-style: solid; + border-top-width: 0.0625rem; + border-left-width: 0; + border-right-width: 0; + border-bottom-width: 0; + border-color: #f7e3db; } -article > header .m-date-day { - display: block; - font-weight: bold; - padding-top: 0.2rem; - padding-bottom: 0.15rem; - font-size: 1.25rem; +table.m-table caption { + padding-bottom: 0.5rem; } -article > header p { - color: #7a7a7a; - font-size: 1.125rem; +table.m-table thead tr:first-child th, table.m-table thead tr:first-child td { + border-top-width: 0.125rem; } -article > header h1::after { - content: " "; - clear: both; - display: table; +table.m-table thead th, table.m-table thead td { + border-bottom-width: 0.125rem; + vertical-align: bottom; } -article > footer { - color: #969696; +table.m-table tfoot th, table.m-table tfoot td { + border-top-width: 0.125rem; } -article > footer p { - font-style: italic; - font-size: 0.85rem; - text-indent: 0; +table.m-table th, table.m-table td { + padding: 0.5rem; } -article section:target { - margin-left: -1.0rem; - border-left-style: solid; - border-left-width: 0.25rem; - padding-left: 0.75rem; - border-color: #cb4b16; +table.m-table.m-big th, table.m-table.m-big td { + padding: 0.75rem 1rem; } -article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, -article section > h4 a, article section > h5 a, article section > h6 a { - text-decoration: none; +table.m-table th { + text-align: left; } -#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { - background-size: cover; - background-color: #666666; - background-position: center center; - background-repeat: no-repeat; - margin-top: -4rem; - padding-top: 5rem; +table.m-table th.m-thin { + font-weight: normal; } -#m-landing-image { - color: #ffffff; +table.m-table td.m-default, table.m-table th.m-default, +table.m-table td.m-primary, table.m-table th.m-primary, +table.m-table td.m-success, table.m-table th.m-success, +table.m-table td.m-warning, table.m-table th.m-warning, +table.m-table td.m-danger, table.m-table th.m-danger, +table.m-table td.m-info, table.m-table th.m-info, +table.m-table td.m-dim, table.m-table th.m-dim { + padding-left: 0.4375rem; + padding-right: 0.4375rem; + border-left-width: 0.0625rem; } -#m-cover-image { - height: 30rem; - margin-bottom: -26rem; +table.m-table.m-big td.m-default, table.m-table.m-big th.m-default, +table.m-table.m-big td.m-primary, table.m-table.m-big th.m-primary, +table.m-table.m-big td.m-success, table.m-table.m-big th.m-success, +table.m-table.m-big td.m-warning, table.m-table.m-big th.m-warning, +table.m-table.m-big td.m-danger, table.m-table.m-big th.m-danger, +table.m-table.m-big td.m-info, table.m-table.m-big th.m-info, +table.m-table.m-big td.m-dim, table.m-table.m-big th.m-dim { + padding-left: 0.9375rem; + padding-right: 0.9375rem; + border-left-width: 0.0625rem; } -#m-landing-cover h1 { - font-size: 2.8rem; - margin-top: -0.5rem; - padding-left: 1.5rem; - padding-bottom: 1rem; - text-transform: lowercase; +table.m-table tr.m-default td, table.m-table td.m-default, +table.m-table tr.m-default th, table.m-table th.m-default, +table.m-table tr.m-primary td, table.m-table td.m-primary, +table.m-table tr.m-primary th, table.m-table th.m-primary, +table.m-table tr.m-success td, table.m-table td.m-success, +table.m-table tr.m-success th, table.m-table th.m-success, +table.m-table tr.m-warning td, table.m-table td.m-warning, +table.m-table tr.m-warning th, table.m-table th.m-warning, +table.m-table tr.m-danger td, table.m-table td.m-danger, +table.m-table tr.m-danger th, table.m-table th.m-danger, +table.m-table tr.m-info td, table.m-table td.m-info, +table.m-table tr.m-info th, table.m-table th.m-info, +table.m-table tr.m-dim td, table.m-table td.m-dim, +table.m-table tr.m-dim th, table.m-table th.m-dim { + border-color: #ffffff; } -#m-landing-cover { - padding-bottom: 10rem; - margin-bottom: -6rem; +.m-block.m-default { border-left-color: #f7e3db; } +.m-block.m-default h3, .m-block.m-default h4, .m-block.m-default h5, .m-block.m-default h6 { + color: #000000; } -article#m-jumbo { - margin-top: -1rem; +.m-block.m-primary { border-left-color: #cb4b16; } +.m-block.m-primary h3, .m-block.m-primary h4, .m-block.m-primary h5, .m-block.m-primary h6 { + color: #cb4b16; } -#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { - background: linear-gradient(transparent 0%, transparent 50%, #ffffff 100%); - width: 100%; - height: 100%; +.m-block.m-success { border-left-color: #31c25d; } +.m-block.m-success h3, .m-block.m-success h4, .m-block.m-success h5, .m-block.m-success h6 { + color: #31c25d; } -article#m-jumbo > header h1, article#m-jumbo > header h2 { - text-align: center; - font-weight: bold; +.m-block.m-warning { border-left-color: #c7cf2f; } +.m-block.m-warning h3, .m-block.m-warning h4, .m-block.m-warning h5, .m-block.m-warning h6 { + color: #c7cf2f; } -article#m-jumbo > header a { - text-decoration: none; +.m-block.m-danger { border-left-color: #f60000; } +.m-block.m-danger h3, .m-block.m-danger h4, .m-block.m-danger h5, .m-block.m-danger h6 { + color: #f60000; } -article#m-jumbo > header #m-jumbo-cover { - padding-bottom: 5rem; +.m-block.m-info { border-left-color: #2e7dc5; } +.m-block.m-info h3, .m-block.m-info h4, .m-block.m-info h5, .m-block.m-info h6 { + color: #2e7dc5; } -article#m-jumbo > header #m-jumbo-image { - font-size: 2.5vmin; - margin-bottom: -3rem; +.m-block.m-dim { + border-left-color: #bdbdbd; + color: #bdbdbd; } -article#m-jumbo > header h1 { - font-size: 10vmin; +.m-block.m-dim a { color: #c0c0c0; } +.m-block.m-dim a:hover, .m-block.m-dim a:focus, .m-block.m-dim a:active { + color: #949494; } -article#m-jumbo > header h2 { - font-size: 3vmin; +.m-block.m-flat { border-color: transparent; } +.m-block.m-flat h3, .m-block.m-flat h4, .m-block.m-flat h5. .m-block.m-flat h6 { + color: #000000; } -@media screen and (max-height: 640px) , screen and (max-width: 640px) { - article#m-jumbo > header h1 { - font-size: 3rem; - } - article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { - font-size: 1rem; - } +.m-note.m-default { background-color: #fbf0ec; } +.m-note.m-default, +table.m-table tr.m-default td, table.m-table td.m-default, +table.m-table tr.m-default th, table.m-table th.m-default { + color: #000000; } -article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { - color: #ffffff; +.m-note.m-default a:hover, +table.m-table tr.m-default td a:hover, table.m-table td.m-default a:hover, +table.m-table tr.m-default th a:hover, table.m-table th.m-default a:hover, +.m-note.m-default a:focus, +table.m-table tr.m-default td a:focus, table.m-table td.m-default a:focus, +table.m-table tr.m-default th a:focus, table.m-table th.m-default a:focus, +.m-note.m-default a:active, +table.m-table tr.m-default td a:active, table.m-table td.m-default a:active, +table.m-table tr.m-default th a:active, table.m-table th.m-default a:active { + color: #cb4b16; } -article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { - color: #f0f0f0; +.m-note.m-primary a, +table.m-table tr.m-primary td a, table.m-table td.m-primary a, +table.m-table tr.m-primary th a, table.m-table th.m-primary a { + color: #ea7944; } -article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { - color: #000000; +.m-note.m-primary, +table.m-table tr.m-primary td, table.m-table td.m-primary, +table.m-table tr.m-primary th, table.m-table th.m-primary { + background-color: #ef9069; + color: #fbe4d9; } -article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { - color: #0f0f0f; +.m-note.m-primary a, +table.m-table tr.m-primary td a, table.m-table td.m-primary a, +table.m-table tr.m-primary th a, table.m-table th.m-primary a { + color: #782f0d; } -.m-landing-news h3 a { - color: #000000; - text-decoration: none; - text-transform: uppercase; +.m-note.m-primary a:hover, +table.m-table tr.m-primary td a:hover, table.m-table td.m-primary a:hover, +table.m-table tr.m-primary th a:hover, table.m-table th.m-primary a:hover, +.m-note.m-primary a:focus, +table.m-table tr.m-primary td a:focus, table.m-table td.m-primary a:focus, +table.m-table tr.m-primary th a:focus, table.m-table th.m-primary a:focus, +.m-note.m-primary a:active, +table.m-table tr.m-primary td a:active, table.m-table td.m-primary a:active, +table.m-table tr.m-primary th a:active, table.m-table th.m-primary a:active { + color: #2f1205; } -.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { - color: #cb4b16; +.m-note.m-success, +table.m-table tr.m-success td, table.m-table td.m-success, +table.m-table tr.m-success th, table.m-table th.m-success { + background-color: #4dd376; + color: #f4fcf6; } -.m-landing-news time { - display: inline-block; - margin-left: 1rem; - float: right; +.m-note.m-success a, +table.m-table tr.m-success td a, table.m-table td.m-success a, +table.m-table tr.m-success th a, table.m-table th.m-success a { + color: #c5f2d1; } -.m-article-pagination { - text-align: center; - padding: 1rem; +.m-note.m-success a:hover, +table.m-table tr.m-success td a:hover, table.m-table td.m-success a:hover, +table.m-table tr.m-success th a:hover, table.m-table th.m-success a:hover, +.m-note.m-success a:focus, +table.m-table tr.m-success td a:focus, table.m-table td.m-success a:focus, +table.m-table tr.m-success th a:focus, table.m-table th.m-success a:focus, +.m-note.m-success a:active, +table.m-table tr.m-success td a:active, table.m-table td.m-success a:active, +table.m-table tr.m-success th a:active, table.m-table th.m-success a:active { + color: #dcf6e3; } -nav.m-navpanel { - text-align: center; +.m-note.m-warning, table.m-table tr.m-warning td, table.m-table td.m-warning, + table.m-table tr.m-warning th, table.m-table th.m-warning { + background-color: #d1d34d; + color: #fcfcf4; } -nav.m-navpanel h3 { - text-transform: uppercase; - font-weight: normal; +.m-note.m-warning a, table.m-table tr.m-warning td a, table.m-table td.m-warning a, + table.m-table tr.m-warning th a, table.m-table th.m-warning a { + color: #f0f1c7; } -nav.m-navpanel ol { - text-transform: lowercase; +.m-note.m-warning a:hover, +table.m-table tr.m-warning td a:hover, table.m-table td.m-warning a:hover, +table.m-table tr.m-warning th a:hover, table.m-table th.m-warning a:hover, +.m-note.m-warning a:focus, +table.m-table tr.m-warning td a:focus, table.m-table td.m-warning a:focus, +table.m-table tr.m-warning th a:focus, table.m-table th.m-warning a:focus, +.m-note.m-warning a:active, +table.m-table tr.m-warning td a:active, table.m-table td.m-warning a:active, +table.m-table tr.m-warning th a:active, table.m-table th.m-warning a:active { + color: #f6f6dc; } -nav.m-navpanel ol, nav.m-navpanel ul { - list-style-type: none; - padding: 0; +.m-note.m-danger, +table.m-table tr.m-danger td, table.m-table td.m-danger, +table.m-table tr.m-danger th, table.m-table th.m-danger { + background-color: #e23e3e; + color: #fdf3f3; } -nav.m-navpanel a { - color: #292929; - text-decoration: none; +.m-note.m-danger a, +table.m-table tr.m-danger td a, table.m-table td.m-danger a, +table.m-table tr.m-danger th a, table.m-table th.m-danger a { + color: #f2c7c6; } -nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { - color: #cb4b16; +.m-note.m-danger a:hover, +table.m-table tr.m-danger td a:hover, table.m-table td.m-danger a:hover, +table.m-table tr.m-danger th a:hover, table.m-table th.m-danger a:hover, +.m-note.m-danger a:focus, +table.m-table tr.m-danger td a:focus, table.m-table td.m-danger a:focus, +table.m-table tr.m-danger th a:focus, table.m-table th.m-danger a:focus, +.m-note.m-danger a:active, +table.m-table tr.m-danger td a:active, table.m-table td.m-danger a:active, +table.m-table tr.m-danger th a:active, table.m-table th.m-danger a:active { + color: #f6dddc; } -ul.m-tagcloud li { display: inline; } -ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } -ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } -ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } -ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } -ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } -div.m-scroll { - max-width: 100%; - overflow-x: auto; +.m-note.m-info, +table.m-table tr.m-info td, table.m-table td.m-info, +table.m-table tr.m-info th, table.m-table th.m-info { + background-color: #4c93d3; + color: #f4f8fc; } -.m-fullwidth { - width: 100%; +.m-note.m-info a, +table.m-table tr.m-info td a, table.m-table td.m-info a, +table.m-table tr.m-info th a, table.m-table th.m-info a { + color: #c6ddf2; } -.m-text-center, .m-text-center.m-noindent, table.m-table th.m-text-center, .m-text-center p { - text-align: center; +.m-note.m-info a:hover, +table.m-table tr.m-info td a:hover, table.m-table td.m-info a:hover, +table.m-table tr.m-info th a:hover, table.m-table th.m-info a:hover, +.m-note.m-info a:focus, +table.m-table tr.m-info td a:focus, table.m-table td.m-info a:focus, +table.m-table tr.m-info th a:focus, table.m-table th.m-info a:focus, +.m-note.m-info a:active, +table.m-table tr.m-info td a:active, table.m-table td.m-info a:active, +table.m-table tr.m-info th a:active, table.m-table th.m-info a:active { + color: #dbeaf7; } -.m-text-left, .m-text-left.m-noindent, table.m-table th.m-text-left, .m-text-right p { - text-align: left; +.m-note.m-dim, +table.m-table tr.m-dim td, table.m-table td.m-dim, +table.m-table tr.m-dim th, table.m-table th.m-dim { + background-color: #f1f1f1; + color: #7c7c7c; } -.m-text-right, .m-text-right.m-noindent, table.m-table th.m-text-right, .m-text-right p { - text-align: right; +.m-note.m-dim a, +table.m-table tr.m-dim td a, table.m-table td.m-dim a, +table.m-table tr.m-dim th a, table.m-table th.m-dim a { + color: #c0c0c0; } -.m-text-top, table.m-table th.m-text-top, table.m-table td.m-text-top { - vertical-align: top; +.m-note.m-dim a:hover, +table.m-table tr.m-dim td a:hover, table.m-table td.m-dim a:hover, +table.m-table tr.m-dim th a:hover, table.m-table th.m-dim a:hover, +.m-note.m-dim a:focus, +table.m-table tr.m-dim td a:focus, table.m-table td.m-dim a:focus, +table.m-table tr.m-dim th a:focus, table.m-table th.m-dim a:focus, +.m-note.m-dim a:active, +table.m-table tr.m-dim td a:active, table.m-table td.m-dim a:active, +table.m-table tr.m-dim th a:active, table.m-table th.m-dim a:active { + color: #949494; } -.m-text-middle, table.m-table th.m-text-middle, table.m-table td.m-text-middle { - vertical-align: middle; +.m-text.m-default, .m-label.m-flat.m-default { color: #000000; } +.m-text.m-primary, .m-label.m-flat.m-primary { color: #cb4b16; } +.m-text.m-success, .m-label.m-flat.m-success { color: #31c25d; } +.m-text.m-warning, .m-label.m-flat.m-warning { color: #c7cf2f; } +.m-text.m-danger, .m-label.m-flat.m-danger { color: #f60000; } +.m-text.m-info, .m-label.m-flat.m-info { color: #2e7dc5; } +.m-text.m-dim, .m-label.m-flat.m-dim { color: #bdbdbd; } +.m-text.m-dim a { color: #c0c0c0; } +.m-text.m-dim a:hover, .m-text.m-dim a:focus, .m-text.m-dim a:active { + color: #949494; } -.m-text-bottom, table.m-table th.m-text-bottom, table.m-table td.m-text-bottom { - vertical-align: bottom; +div.m-button a, .m-label { color: #ffffff; } +div.m-button.m-flat a { color: #000000; } +div.m-button.m-flat a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { + color: #cb4b16; } -.m-text.m-small { - font-size: 85.4%; +div.m-button.m-default a, .m-label:not(.m-flat).m-default { background-color: #000000; } +div.m-button.m-primary a, .m-label:not(.m-flat).m-primary { background-color: #cb4b16; } +div.m-button.m-success a, .m-label:not(.m-flat).m-success { background-color: #31c25d; } +div.m-button.m-warning a, .m-label:not(.m-flat).m-warning { background-color: #c7cf2f; } +div.m-button.m-danger a, .m-label:not(.m-flat).m-danger { background-color: #f60000; } +div.m-button.m-info a, .m-label:not(.m-flat).m-info { background-color: #2e7dc5; } +div.m-button.m-dim a, .m-label:not(.m-flat).m-dim { background-color: #bdbdbd; } +div.m-button.m-default a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { + background-color: #cb4b16; } -.m-text.m-big { - font-size: 117%; +div.m-button.m-primary a:hover, div.m-button.m-primary a:focus, div.m-button.m-primary a:active { + background-color: #000000; } -.m-text.m-strong { - font-weight: bold; +div.m-button.m-success a:hover, div.m-button.m-success a:focus, div.m-button.m-success a:active { + background-color: #dcf6e3; } -.m-text.m-em { - font-style: italic; +div.m-button.m-warning a:hover, div.m-button.m-warning a:focus, div.m-button.m-warning a:active { + background-color: #f6f6dc; } -h1 .m-thin, h2 .m-thin, h3 .m-thin, h4 .m-thin, h5 .m-thin, h6 .m-thin { - font-weight: normal; +div.m-button.m-danger a:hover, div.m-button.m-danger a:focus, div.m-button.m-danger a:active { + background-color: #f6dddc; } -ul.m-unstyled, ol.m-unstyled { - list-style-type: none; - padding-left: 0; +div.m-button.m-info a:hover, div.m-button.m-info a:focus, div.m-button.m-info a:active { + background-color: #c6ddf2; } -ul[class*='m-block-'], ol[class*='m-block-'] { - padding-left: 0; +div.m-button.m-dim a:hover, div.m-button.m-dim a:focus, div.m-button.m-dim a:active { + background-color: #c0c0c0; } -ul[class*='m-block-'] li, ol[class*='m-block-'] li { - display: inline; +img.m-image, svg.m-image { + display: block; + margin-left: auto; + margin-right: auto; } -ul[class*='m-block-bar-'] li:not(:last-child)::after, ol[class*='m-block-bar-'] li:not(:last-child)::after { - content: " | "; +div.m-image { + text-align: center; } -@media screen and (min-width: 576px) { - ul.m-block-bar-s, ol.m-block-bar-s { padding-left: 2rem; } - ul.m-block-bar-s li, ol.m-block-bar-s li { display: list-item; } - ul.m-block-bar-s li:not(:last-child)::after, ol.m-block-bar-s li:not(:last-child)::after { content: ""; } -} -@media screen and (min-width: 768px) { - ul.m-block-bar-m, ol.m-block-bar-m { padding-left: 2rem; } - ul.m-block-bar-m li, ol.m-block-bar-m li { display: list-item; } - ul.m-block-bar-m li:not(:last-child)::after, ol.m-block-bar-m li:not(:last-child)::after { content: ""; } -} -@media screen and (min-width: 992px) { - ul.m-block-bar-l, ol.m-block-bar-l { padding-left: 2rem; } - ul.m-block-bar-l li, ol.m-block-bar-l li { display: list-item; } - ul.m-block-bar-l li:not(:last-child)::after, ol.m-block-bar-l li:not(:last-child)::after { content: ""; } -} -p.m-poem { - text-indent: 0; - text-align: left; - margin-left: 1.5rem; -} -p.m-transition { - color: #f7e3db; - text-indent: 0; - text-align: center; - font-size: 2rem; -} -dl.m-diary { - margin-bottom: 1.25rem; -} -dl.m-diary:last-child { - margin-bottom: 0.25rem; -} -dl.m-diary dt { - font-weight: bold; - width: 3.5rem; - float: left; - clear: both; - padding-top: 0.25rem; -} -dl.m-diary dd { - padding-top: 0.25rem; - padding-left: 3.5rem; -} -.m-note { +img.m-image, svg.m-image, div.m-image img { + max-width: 100%; border-radius: 0.2rem; - padding: 1rem; } -.m-note pre, .m-note code { - background-color: rgba(251, 240, 236, 0.5); +div.m-image.m-fullwidth img, div.m-image.m-fullwidth svg { + width: 100%; } -.m-frame { - background-color: #ffffff; +figure.m-figure { + max-width: 100%; + margin-top: 0; + margin-left: auto; + margin-right: auto; + position: relative; + display: table; +} +figure.m-figure:before { + position: absolute; + content: ' '; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: -1; border-style: solid; border-width: 0.125rem; border-radius: 0.2rem; border-color: #f7e3db; - padding: 0.875rem; } -.m-block { - border-style: solid; - border-width: 0.0625rem; - border-left-width: 0.25rem; - border-radius: 0.2rem; - border-color: #f7e3db; - padding: 0.9375rem 0.9375rem 0.9375rem 0.75rem; +figure.m-figure.m-flat:before { + border-color: transparent; } -.m-block.m-badge::after { - content: ' '; - display: block; - clear: both; +figure.m-figure > * { + margin-left: 1rem; + margin-right: 1rem; + display: table-caption; + caption-side: bottom; } -.m-block.m-badge h3 { - margin-left: 5rem; +figure.m-figure > *:first-child { + display: inline; } -.m-block.m-badge p { - margin-left: 5rem; - text-indent: 0; +figure.m-figure > *:last-child { + margin-bottom: 1rem; } -.m-block.m-badge img { - width: 4rem; - height: 4rem; - border-radius: 2rem; - float: left; +figure.m-figure img { + position: relative; + margin-left: 0; + margin-right: 0; + margin-bottom: 0; + border-top-left-radius: 0.2rem; + border-top-right-radius: 0.2rem; + max-width: 100%; } -div.m-button { - text-align: center; +figure.m-figure.m-flat img { + border-bottom-left-radius: 0.2rem; + border-bottom-right-radius: 0.2rem; } -div.m-button a { - display: inline-block; - border-radius: 0.2rem; - padding-top: 0.75rem; - padding-bottom: 0.75rem; - padding-left: 1.5rem; - padding-right: 1.5rem; - text-decoration: none; +figure.m-figure figcaption { + margin-top: 0.5rem; + margin-bottom: 0.5rem; + font-weight: normal; font-size: 1.17rem; } -div.m-button.m-fullwidth a { - display: block; - padding-left: 0.5rem; - padding-right: 0.5rem; +figure.m-figure a img { + margin-left: -1rem; + margin-right: -1rem; } -div.m-button a .m-big:first-child { - font-size: 1.37rem; - font-weight: bold; +figure.m-figure.m-fullwidth, figure.m-figure.m-fullwidth > * { + display: block; } -div.m-button a .m-small:last-child { - font-size: 0.854rem; +figure.m-figure.m-fullwidth > *:first-child { + display: inline; } -.m-label { - border-radius: 0.2rem; - font-size: 75%; - font-weight: normal; - padding: 0.125rem 0.25rem; - vertical-align: 7.5%; +figure.m-figure.m-fullwidth img { + width: 100%; } -.m-label.m-flat { - border-width: 0.0625rem; - border-style: solid; - border-color: #bdbdbd; - padding: 0.0625rem 0.1875rem; +figure.m-figure.m-fullwidth:after { + content: ' '; + display: block; + margin-top: 1rem; + height: 1px; } -table.m-table { - border-collapse: collapse; - margin-left: auto; - margin-right: auto; +figure.m-code-figure, figure.m-console-figure { + margin-top: 0; + margin-left: 0; + margin-right: 0; + position: relative; + padding: 1rem; } -table.m-table.m-big { - margin-top: 1.75rem; +figure.m-code-figure:before, figure.m-console-figure:before { + position: absolute; + content: ' '; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: -1; + border-style: solid; + border-width: 0.125rem; + border-radius: 0.2rem; } -div.m-scroll > table.m-table:last-child { - margin-bottom: 0.0625rem; +figure.m-code-figure:before { + border-color: #fbf0ec; } -table.m-table:not(.m-flat) tbody tr:hover { - background-color: #f7e3db; +figure.m-console-figure:before { + border-color: #000000; } -table.m-table th, table.m-table td { - vertical-align: top; - border-style: solid; - border-top-width: 0.0625rem; - border-left-width: 0; - border-right-width: 0; - border-bottom-width: 0; - border-color: #f7e3db; +figure.m-code-figure.m-flat:before, figure.m-console-figure.m-flat:before { + border-color: transparent; } -table.m-table caption { - padding-bottom: 0.5rem; +figure.m-code-figure > pre:first-child, figure.m-console-figure > pre:first-child { + position: relative; + margin: -1rem -1rem 1rem -1rem; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; } -table.m-table thead tr:first-child th, table.m-table thead tr:first-child td { - border-top-width: 0.125rem; +figure.m-figure.m-default:before { border-color: #fbf0ec; } +figure.m-figure.m-default figcaption { color: #000000; } +figure.m-figure.m-primary:before { border-color: #ef9069; } +figure.m-figure.m-primary figcaption { color: #cb4b16; } +figure.m-figure.m-success:before { border-color: #4dd376; } +figure.m-figure.m-success figcaption { color: #31c25d; } +figure.m-figure.m-warning:before { border-color: #d1d34d; } +figure.m-figure.m-warning figcaption { color: #c7cf2f; } +figure.m-figure.m-danger:before { border-color: #e23e3e; } +figure.m-figure.m-danger figcaption { color: #f60000; } +figure.m-figure.m-info:before { border-color: #4c93d3; } +figure.m-figure.m-info figcaption { color: #2e7dc5; } +figure.m-figure.m-dim:before { border-color: #f1f1f1; } +figure.m-figure.m-dim { color: #bdbdbd; } +figure.m-figure.m-dim a { color: #c0c0c0; } +figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m-dim a:active { + color: #949494; } -table.m-table thead th, table.m-table thead td { - border-bottom-width: 0.125rem; - vertical-align: bottom; +.m-imagegrid > div { + background-color: #ffffff; /* to avoid section HL shining through */ } -table.m-table tfoot th, table.m-table tfoot td { - border-top-width: 0.125rem; +.m-imagegrid > div > figure { + display: block; + float: left; + position: relative; + margin: 0; } -table.m-table th, table.m-table td { +.m-imagegrid > div > figure > div, +.m-imagegrid > div > figure > figcaption, +.m-imagegrid > div > figure > a > div, +.m-imagegrid > div > figure > a > figcaption { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + border-color: #ffffff; + border-style: solid; + border-width: 0.25rem; padding: 0.5rem; } -table.m-table.m-big th, table.m-table.m-big td { - padding: 0.75rem 1rem; +.m-imagegrid > div > figure:first-child > div, +.m-imagegrid > div > figure:first-child > figcaption, +.m-imagegrid > div > figure:first-child > a > div, +.m-imagegrid > div > figure:first-child > a > figcaption { + border-left-width: 0; } -table.m-table th { - text-align: left; +.m-imagegrid > div > figure:last-child > div, +.m-imagegrid > div > figure:last-child > figcaption, +.m-imagegrid > div > figure:last-child > a > div, +.m-imagegrid > div > figure:last-child > a > figcaption { + border-right-width: 0; } -table.m-table th.m-thin { - font-weight: normal; +.m-imagegrid > div > figure > figcaption, +.m-imagegrid > div > figure > a > figcaption { + color: transparent; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-size: 0.75rem; } -table.m-table td.m-default, table.m-table th.m-default, -table.m-table td.m-primary, table.m-table th.m-primary, -table.m-table td.m-success, table.m-table th.m-success, -table.m-table td.m-warning, table.m-table th.m-warning, -table.m-table td.m-danger, table.m-table th.m-danger, -table.m-table td.m-info, table.m-table th.m-info, -table.m-table td.m-dim, table.m-table th.m-dim { - padding-left: 0.4375rem; - padding-right: 0.4375rem; - border-left-width: 0.0625rem; +.m-imagegrid > div > figure > div::before, +.m-imagegrid > div > figure > figcaption::before, +.m-imagegrid > div > figure > a > div::before, +.m-imagegrid > div > figure > a > figcaption::before { + content: ''; + display: inline-block; + height: 100%; + vertical-align: bottom; + width: 0; } -table.m-table.m-big td.m-default, table.m-table.m-big th.m-default, -table.m-table.m-big td.m-primary, table.m-table.m-big th.m-primary, -table.m-table.m-big td.m-success, table.m-table.m-big th.m-success, -table.m-table.m-big td.m-warning, table.m-table.m-big th.m-warning, -table.m-table.m-big td.m-danger, table.m-table.m-big th.m-danger, -table.m-table.m-big td.m-info, table.m-table.m-big th.m-info, -table.m-table.m-big td.m-dim, table.m-table.m-big th.m-dim { - padding-left: 0.9375rem; - padding-right: 0.9375rem; - border-left-width: 0.0625rem; +.m-imagegrid > div > figure:hover > figcaption, +.m-imagegrid > div > figure:hover > a > figcaption { + background: linear-gradient(transparent 0%, transparent 75%, rgba(0, 0, 0, 0.85) 100%); + color: #ffffff; } -table.m-table tr.m-default td, table.m-table td.m-default, -table.m-table tr.m-default th, table.m-table th.m-default, -table.m-table tr.m-primary td, table.m-table td.m-primary, -table.m-table tr.m-primary th, table.m-table th.m-primary, -table.m-table tr.m-success td, table.m-table td.m-success, -table.m-table tr.m-success th, table.m-table th.m-success, -table.m-table tr.m-warning td, table.m-table td.m-warning, -table.m-table tr.m-warning th, table.m-table th.m-warning, -table.m-table tr.m-danger td, table.m-table td.m-danger, -table.m-table tr.m-danger th, table.m-table th.m-danger, -table.m-table tr.m-info td, table.m-table td.m-info, -table.m-table tr.m-info th, table.m-table th.m-info, -table.m-table tr.m-dim td, table.m-table td.m-dim, -table.m-table tr.m-dim th, table.m-table th.m-dim { - border-color: #ffffff; +.m-imagegrid > div > figure > img, +.m-imagegrid > div > figure > a > img { + width: 100%; + height: 100%; } -.m-block.m-default { border-left-color: #f7e3db; } -.m-block.m-default h3, .m-block.m-default h4, .m-block.m-default h5, .m-block.m-default h6 { - color: #000000; +.m-imagegrid > div::after { + display: block; + content: ' '; + clear: both; } -.m-block.m-primary { border-left-color: #cb4b16; } -.m-block.m-primary h3, .m-block.m-primary h4, .m-block.m-primary h5, .m-block.m-primary h6 { - color: #cb4b16; +@media screen and (max-width: 767px) { + .m-imagegrid > div > figure { + float: none; + width: 100% !important; + } + .m-imagegrid > div > figure > div, + .m-imagegrid > div > figure > figcaption, + .m-imagegrid > div > figure > a > div, + .m-imagegrid > div > figure > a > figcaption { + border-left-width: 0; + border-right-width: 0; + } } -.m-block.m-success { border-left-color: #31c25d; } -.m-block.m-success h3, .m-block.m-success h4, .m-block.m-success h5, .m-block.m-success h6 { - color: #31c25d; +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-note, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-frame, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-block, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-imagegrid, +.m-container-inflatable > .m-row > [class*='m-col-'] > pre, +.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-code-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-console-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-note, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-frame, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-block, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-imagegrid, +.m-container-inflatable > .m-row > [class*='m-col-'] section > pre, +.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-code-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-console-figure { + margin-left: -1rem; + margin-right: -1rem; } -.m-block.m-warning { border-left-color: #c7cf2f; } -.m-block.m-warning h3, .m-block.m-warning h4, .m-block.m-warning h5, .m-block.m-warning h6 { - color: #c7cf2f; +@media screen and (min-width: 576px) { + .m-container-inflatable > .m-row > .m-col-s-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-s-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-danger { border-left-color: #f60000; } -.m-block.m-danger h3, .m-block.m-danger h4, .m-block.m-danger h5, .m-block.m-danger h6 { - color: #f60000; +@media screen and (min-width: 768px) { + .m-container-inflatable > .m-row > .m-col-m-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-m-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-info { border-left-color: #2e7dc5; } -.m-block.m-info h3, .m-block.m-info h4, .m-block.m-info h5, .m-block.m-info h6 { - color: #2e7dc5; +@media screen and (min-width: 992px) { + .m-container-inflatable > .m-row > .m-col-l-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-l-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-dim { - border-left-color: #bdbdbd; - color: #bdbdbd; +pre.m-code span.hll { + margin-left: -1.0rem; + margin-right: -1.0rem; + padding-left: 1.0rem; } -.m-block.m-dim a { color: #c0c0c0; } -.m-block.m-dim a:hover, .m-block.m-dim a:focus, .m-block.m-dim a:active { - color: #949494; +pre.m-code.m-inverted { + color: rgba(91, 91, 91, 0.33); } -.m-block.m-flat { border-color: transparent; } -.m-block.m-flat h3, .m-block.m-flat h4, .m-block.m-flat h5. .m-block.m-flat h6 { - color: #000000; +pre.m-code.m-inverted > span { + opacity: 0.3333; } -.m-note.m-default { background-color: #fbf0ec; } -.m-note.m-default, -table.m-table tr.m-default td, table.m-table td.m-default, -table.m-table tr.m-default th, table.m-table th.m-default { +pre.m-code.m-inverted > span.hll { color: #000000; + opacity: 1; + background-color: transparent; + border-color: transparent; } -.m-note.m-default a:hover, -table.m-table tr.m-default td a:hover, table.m-table td.m-default a:hover, -table.m-table tr.m-default th a:hover, table.m-table th.m-default a:hover, -.m-note.m-default a:focus, -table.m-table tr.m-default td a:focus, table.m-table td.m-default a:focus, -table.m-table tr.m-default th a:focus, table.m-table th.m-default a:focus, -.m-note.m-default a:active, -table.m-table tr.m-default td a:active, table.m-table td.m-default a:active, -table.m-table tr.m-default th a:active, table.m-table th.m-default a:active { - color: #cb4b16; +div.m-math { + overflow-x: auto; + overflow-y: hidden; + text-align: center; } -.m-note.m-primary a, -table.m-table tr.m-primary td a, table.m-table td.m-primary a, -table.m-table tr.m-primary th a, table.m-table th.m-primary a { - color: #ea7944; +div.m-plot svg { + text-align: center; } -.m-note.m-primary, -table.m-table tr.m-primary td, table.m-table td.m-primary, -table.m-table tr.m-primary th, table.m-table th.m-primary { - background-color: #ef9069; - color: #fbe4d9; +div.m-plot .m-background { + fill: #fbf0ec; } -.m-note.m-primary a, -table.m-table tr.m-primary td a, table.m-table td.m-primary a, -table.m-table tr.m-primary th a, table.m-table th.m-primary a { - color: #782f0d; +div.m-plot svg .m-label { font-size: 11px; } +div.m-plot svg .m-title { font-size: 13px; } +div.m-plot svg .m-label, div.m-plot svg .m-title { fill: #000000; } +div.m-plot svg .m-line { + stroke: #000000; + stroke-width: 0.8; } -.m-note.m-primary a:hover, -table.m-table tr.m-primary td a:hover, table.m-table td.m-primary a:hover, -table.m-table tr.m-primary th a:hover, table.m-table th.m-primary a:hover, -.m-note.m-primary a:focus, -table.m-table tr.m-primary td a:focus, table.m-table td.m-primary a:focus, -table.m-table tr.m-primary th a:focus, table.m-table th.m-primary a:focus, -.m-note.m-primary a:active, -table.m-table tr.m-primary td a:active, table.m-table td.m-primary a:active, -table.m-table tr.m-primary th a:active, table.m-table th.m-primary a:active { - color: #2f1205; +div.m-plot svg .m-error { + stroke: #000000; + stroke-width: 1.5; } -.m-note.m-success, -table.m-table tr.m-success td, table.m-table td.m-success, -table.m-table tr.m-success th, table.m-table th.m-success { - background-color: #4dd376; - color: #f4fcf6; +div.m-plot svg .m-label.m-dim { fill: #bdbdbd; } +div.m-math svg, svg.m-math { fill: #000000; } +div.m-math.m-default svg, svg.m-math.m-default, div.m-plot svg .m-bar.m-default { + fill: #000000; } -.m-note.m-success a, -table.m-table tr.m-success td a, table.m-table td.m-success a, -table.m-table tr.m-success th a, table.m-table th.m-success a { - color: #c5f2d1; +div.m-math.m-primary svg, svg.m-math.m-primary, div.m-plot svg .m-bar.m-primary { + fill: #cb4b16; } -.m-note.m-success a:hover, -table.m-table tr.m-success td a:hover, table.m-table td.m-success a:hover, -table.m-table tr.m-success th a:hover, table.m-table th.m-success a:hover, -.m-note.m-success a:focus, -table.m-table tr.m-success td a:focus, table.m-table td.m-success a:focus, -table.m-table tr.m-success th a:focus, table.m-table th.m-success a:focus, -.m-note.m-success a:active, -table.m-table tr.m-success td a:active, table.m-table td.m-success a:active, -table.m-table tr.m-success th a:active, table.m-table th.m-success a:active { - color: #dcf6e3; +div.m-math.m-success svg, svg.m-math.m-success, div.m-plot svg .m-bar.m-success { + fill: #31c25d; } -.m-note.m-warning, table.m-table tr.m-warning td, table.m-table td.m-warning, - table.m-table tr.m-warning th, table.m-table th.m-warning { - background-color: #d1d34d; - color: #fcfcf4; +div.m-math.m-warning svg, svg.m-math.m-warning, div.m-plot svg .m-bar.m-warning { + fill: #c7cf2f; } -.m-note.m-warning a, table.m-table tr.m-warning td a, table.m-table td.m-warning a, - table.m-table tr.m-warning th a, table.m-table th.m-warning a { - color: #f0f1c7; +div.m-math.m-danger svg, svg.m-math.m-danger, div.m-plot svg .m-bar.m-danger { + fill: #f60000; } -.m-note.m-warning a:hover, -table.m-table tr.m-warning td a:hover, table.m-table td.m-warning a:hover, -table.m-table tr.m-warning th a:hover, table.m-table th.m-warning a:hover, -.m-note.m-warning a:focus, -table.m-table tr.m-warning td a:focus, table.m-table td.m-warning a:focus, -table.m-table tr.m-warning th a:focus, table.m-table th.m-warning a:focus, -.m-note.m-warning a:active, -table.m-table tr.m-warning td a:active, table.m-table td.m-warning a:active, -table.m-table tr.m-warning th a:active, table.m-table th.m-warning a:active { - color: #f6f6dc; +div.m-math.m-info svg, svg.m-math.m-info, div.m-plot svg .m-bar.m-info { + fill: #2e7dc5; } -.m-note.m-danger, -table.m-table tr.m-danger td, table.m-table td.m-danger, -table.m-table tr.m-danger th, table.m-table th.m-danger { - background-color: #e23e3e; - color: #fdf3f3; +div.m-math.m-dim svg, svg.m-math.m-dim, div.m-plot svg .m-bar.m-dim { + fill: #bdbdbd; } -.m-note.m-danger a, -table.m-table tr.m-danger td a, table.m-table td.m-danger a, -table.m-table tr.m-danger th a, table.m-table th.m-danger a { - color: #f2c7c6; +p, ul, ol, dl, blockquote, pre, figure.m-code-figure, figure.m-console-figure, +hr, .m-note, .m-frame, .m-block, div.m-button, div.m-scroll, table.m-table, +div.m-image, img.m-image, svg.m-image, figure.m-figure, .m-imagegrid, div.m-math { + margin-bottom: 1rem; } -.m-note.m-danger a:hover, -table.m-table tr.m-danger td a:hover, table.m-table td.m-danger a:hover, -table.m-table tr.m-danger th a:hover, table.m-table th.m-danger a:hover, -.m-note.m-danger a:focus, -table.m-table tr.m-danger td a:focus, table.m-table td.m-danger a:focus, -table.m-table tr.m-danger th a:focus, table.m-table th.m-danger a:focus, -.m-note.m-danger a:active, -table.m-table tr.m-danger td a:active, table.m-table td.m-danger a:active, -table.m-table tr.m-danger th a:active, table.m-table th.m-danger a:active { - color: #f6dddc; +p:last-child, ul:last-child, ol:last-child, dl:last-child, blockquote:last-child, +pre:last-child, figure.m-code-figure:last-child, figure.m-console-figure:last-child, +hr:last-child, .m-note:last-child, .m-frame:last-child, .m-block:last-child, +div.m-button:last-child, div.m-scroll:last-child, table.m-table:last-child, +img.m-image:last-child, svg.m-image:last-child, div.m-image:last-child, +figure.m-figure:last-child, .m-imagegrid:last-child, div.m-math:last-child { + margin-bottom: 0; } -.m-note.m-info, -table.m-table tr.m-info td, table.m-table td.m-info, -table.m-table tr.m-info th, table.m-table th.m-info { - background-color: #4c93d3; - color: #f4f8fc; +li > p:last-child, li > blockquote:last-child, li > pre:last-child, +li > figure.m-code-figure:last-child, li > figure.m-console-figure:last-child, +li > .m-note:last-child, li > .m-frame:last-child, li > .m-block:last-child, +li > div.m-button:last-child, li > div.m-scroll:last-child, li > table.m-table:last-child, +li > img.m-image:last-child, li > svg.m-image:last-child, li > div.m-image:last-child, +li > figure.m-figure:last-child, li > div.m-math:last-child { + margin-bottom: 1rem; } -.m-note.m-info a, -table.m-table tr.m-info td a, table.m-table td.m-info a, -table.m-table tr.m-info th a, table.m-table th.m-info a { - color: #c6ddf2; +li:last-child > p:last-child, li:last-child > blockquote:last-child, li:last-child > pre:last-child, +li:last-child > figure.m-code-figure:last-child, li:last-child > figure.m-console-figure:last-child, +li:last-child > .m-note:last-child, li:last-child > .m-frame:last-child, li:last-child > .m-block:last-child, +li:last-child > div.m-button:last-child, li:last-child > div.m-scroll:last-child, +li:last-child > table.m-table:last-child, li:last-child > img.m-image:last-child, +li:last-child > svg.m-image:last-child, li:last-child > div.m-image:last-child, +li:last-child > figure.m-figure:last-child, li:last-child > div.m-math:last-child { + margin-bottom: 0; } -.m-note.m-info a:hover, -table.m-table tr.m-info td a:hover, table.m-table td.m-info a:hover, -table.m-table tr.m-info th a:hover, table.m-table th.m-info a:hover, -.m-note.m-info a:focus, -table.m-table tr.m-info td a:focus, table.m-table td.m-info a:focus, -table.m-table tr.m-info th a:focus, table.m-table th.m-info a:focus, -.m-note.m-info a:active, -table.m-table tr.m-info td a:active, table.m-table td.m-info a:active, -table.m-table tr.m-info th a:active, table.m-table th.m-info a:active { - color: #dbeaf7; + +body > header > nav { + width: 100%; + background-color: #ffffff; + min-height: 3rem; } -.m-note.m-dim, -table.m-table tr.m-dim td, table.m-table td.m-dim, -table.m-table tr.m-dim th, table.m-table th.m-dim { - background-color: #f1f1f1; - color: #7c7c7c; +body > header > nav.m-navbar-landing, +body > header > nav.m-navbar-cover { + background-color: transparent; + position: relative; } -.m-note.m-dim a, -table.m-table tr.m-dim td a, table.m-table td.m-dim a, -table.m-table tr.m-dim th a, table.m-table th.m-dim a { - color: #c0c0c0; +body > header > nav.m-navbar-landing { + opacity: 0.8; } -.m-note.m-dim a:hover, -table.m-table tr.m-dim td a:hover, table.m-table td.m-dim a:hover, -table.m-table tr.m-dim th a:hover, table.m-table th.m-dim a:hover, -.m-note.m-dim a:focus, -table.m-table tr.m-dim td a:focus, table.m-table td.m-dim a:focus, -table.m-table tr.m-dim th a:focus, table.m-table th.m-dim a:focus, -.m-note.m-dim a:active, -table.m-table tr.m-dim td a:active, table.m-table td.m-dim a:active, -table.m-table tr.m-dim th a:active, table.m-table th.m-dim a:active { - color: #949494; +body > header > nav.m-navbar-cover { + background-color: rgba(255, 255, 255, 0.25); + opacity: 1; } -.m-text.m-default, .m-label.m-flat.m-default { color: #000000; } -.m-text.m-primary, .m-label.m-flat.m-primary { color: #cb4b16; } -.m-text.m-success, .m-label.m-flat.m-success { color: #31c25d; } -.m-text.m-warning, .m-label.m-flat.m-warning { color: #c7cf2f; } -.m-text.m-danger, .m-label.m-flat.m-danger { color: #f60000; } -.m-text.m-info, .m-label.m-flat.m-info { color: #2e7dc5; } -.m-text.m-dim, .m-label.m-flat.m-dim { color: #bdbdbd; } -.m-text.m-dim a { color: #c0c0c0; } -.m-text.m-dim a:hover, .m-text.m-dim a:focus, .m-text.m-dim a:active { - color: #949494; +body > header > nav.m-navbar-landing:hover, +body > header > nav.m-navbar-cover:hover { + background-color: rgba(255, 255, 255, 0.75); + opacity: 1; } -div.m-button a, .m-label { color: #ffffff; } -div.m-button.m-flat a { color: #000000; } -div.m-button.m-flat a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { +body> header > nav.m-navbar-landing:target, +body> header > nav.m-navbar-cover:target { + background-color: #ffffff; + opacity: 1; +} +body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { + visibility: hidden; +} +body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { + visibility: visible; +} +body > header > nav { + margin-left: auto; + margin-right: auto; + color: #000000; +} +body > header > nav a { + text-decoration: none; + text-transform: lowercase; + display: inline-block; + vertical-align: middle; + line-height: 2.75rem; + color: #000000; +} +body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { + text-transform: lowercase; + font-weight: normal; + font-size: 1.125rem; + padding-left: 1rem; + padding-right: 1rem; +} +body > header > nav a#m-navbar-brand .m-thin { + font-weight: normal; +} +body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { + content:'\2630'; +} +body > header > nav #m-navbar-collapse { + padding-bottom: 1rem; +} +body > header > nav #m-navbar-collapse li { + border-style: solid; + border-color: transparent; + border-width: 0 0 0 0.25rem; + margin-left: -1rem; +} +body > header > nav #m-navbar-collapse li a { + border-style: solid; + border-color: transparent; + line-height: 1.5rem; + margin-left: -0.25rem; + padding-left: 0.75rem; + border-width: 0 0 0 0.25rem; + width: 100%; +} +body > header > nav #m-navbar-collapse li a#m-navbar-current { + color: #ea7944; + border-color: #ea7944; +} +body > header > nav ol { + list-style-type: none; + margin: 0; +} +body > header > nav ol ol { + padding-left: 1.5rem; +} +body > header > nav [class*='m-col-'] { + padding-top: 0; + padding-bottom: 0; +} +body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { color: #cb4b16; } -div.m-button.m-default a, .m-label:not(.m-flat).m-default { background-color: #000000; } -div.m-button.m-primary a, .m-label:not(.m-flat).m-primary { background-color: #cb4b16; } -div.m-button.m-success a, .m-label:not(.m-flat).m-success { background-color: #31c25d; } -div.m-button.m-warning a, .m-label:not(.m-flat).m-warning { background-color: #c7cf2f; } -div.m-button.m-danger a, .m-label:not(.m-flat).m-danger { background-color: #f60000; } -div.m-button.m-info a, .m-label:not(.m-flat).m-info { background-color: #2e7dc5; } -div.m-button.m-dim a, .m-label:not(.m-flat).m-dim { background-color: #bdbdbd; } -div.m-button.m-default a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { - background-color: #cb4b16; +body > header > nav #m-navbar-collapse li:hover { + border-color: #cb4b16; } -div.m-button.m-primary a:hover, div.m-button.m-primary a:focus, div.m-button.m-primary a:active { - background-color: #000000; +body > header > nav #m-navbar-collapse li a:hover, +body > header > nav #m-navbar-collapse li a:focus, +body > header > nav #m-navbar-collapse li a:active { + border-color: #cb4b16; + background-color: rgba(255, 255, 255, 0.5); +} +body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { + background-color: var(--header-link-active-background-color-semi); +} +body > header > nav #m-navbar-hide { + display: none; +} +body > header > nav:target #m-navbar-collapse { + display: block; +} +body > header > nav:target #m-navbar-show { + display: none; +} +body > header > nav:target #m-navbar-hide { + display: inline-block; +} +@media screen and (min-width: 768px) { + body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, + body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { + display: none; + } + body > header > nav #m-navbar-collapse li a { + line-height: 2.75rem; + } + body > header > nav a, body > header > nav #m-navbar-collapse li a { + margin-left: 0; + padding-left: 1rem; + padding-right: 1rem; + white-space: nowrap; + } + body > header > nav #m-navbar-collapse { + padding-bottom: 0; + } + body > header > nav #m-navbar-collapse li ol { + background-color: #ffffff; + } + body > header > nav #m-navbar-collapse ol ol li { + margin-left: 0; + padding-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse ol ol li a { + padding-left: 0.75rem; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li { + margin-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li > a { + border-width: 0.25rem 0 0 0; + } + body > header > nav #m-navbar-collapse ol { + padding-left: 0; + padding-right: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { + float: left; + } + body > header > nav #m-navbar-collapse ol ol { + z-index: 99999; + position: absolute; + visibility: hidden; + } + body > header > nav #m-navbar-collapse li:hover ol { + visibility: visible; + } } -div.m-button.m-success a:hover, div.m-button.m-success a:focus, div.m-button.m-success a:active { - background-color: #dcf6e3; +body > footer { + width: 100%; } -div.m-button.m-warning a:hover, div.m-button.m-warning a:focus, div.m-button.m-warning a:active { - background-color: #f6f6dc; +body > footer > nav { + padding-top: 1rem; + padding-bottom: 1rem; + font-size: 0.85rem; + text-align: center; + color: #7c7c7c; + background-color: #eeeeee; } -div.m-button.m-danger a:hover, div.m-button.m-danger a:focus, div.m-button.m-danger a:active { - background-color: #f6dddc; +body > footer > nav h3, body > footer > nav h3 a { + text-transform: uppercase; + font-weight: normal; } -div.m-button.m-info a:hover, div.m-button.m-info a:focus, div.m-button.m-info a:active { - background-color: #c6ddf2; +body > footer > nav ul { + list-style-type: none; + padding: 0; + margin: 0; } -div.m-button.m-dim a:hover, div.m-button.m-dim a:focus, div.m-button.m-dim a:active { - background-color: #c0c0c0; +body > footer > nav a { + text-decoration: none; + text-transform: lowercase; + color: #191919; } -img.m-image, svg.m-image { - display: block; - margin-left: auto; - margin-right: auto; +body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { + color: #494949; } -div.m-image { - text-align: center; +body > main { + padding-top: 1rem; + padding-bottom: 1rem; } -img.m-image, svg.m-image, div.m-image img { - max-width: 100%; - border-radius: 0.2rem; +article h1 { + font-size: 1.75rem; } -div.m-image.m-fullwidth img, div.m-image.m-fullwidth svg { - width: 100%; +article h1 .m-breadcrumb { + color: #bdbdbd; + font-weight: normal; } -figure.m-figure { - max-width: 100%; - margin-top: 0; - margin-left: auto; - margin-right: auto; - position: relative; - display: table; +article h1 .m-breadcrumb a { + color: #cb4b16; } -figure.m-figure:before { - position: absolute; - content: ' '; - top: 0; - bottom: 0; - left: 0; - right: 0; - z-index: -1; - border-style: solid; - border-width: 0.125rem; - border-radius: 0.2rem; - border-color: #f7e3db; +article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { + color: #802f0e; } -figure.m-figure.m-flat:before { - border-color: transparent; +article > header h1 { + font-size: 2rem; + margin-bottom: 0.5rem; } -figure.m-figure > * { - margin-left: 1rem; - margin-right: 1rem; - display: table-caption; - caption-side: bottom; +article h1 a, article > header h1, article > header h1 a, +article section > h2, article section > h2 a, +article section > h3, article section > h3 a, +article section > h4, article section > h4 a, +article section > h5, article section > h5 a, +article section > h6, article section > h6 a { + color: #cb4b16; } -figure.m-figure > *:first-child { - display: inline; +article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, +article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, +article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, +article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, +article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, +article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { + color: #802f0e; } -figure.m-figure > *:last-child { - margin-bottom: 1rem; +article > header .m-date { + display: block; + width: 2.5rem; + float: left; + text-align: center; + line-height: 95%; + font-size: 0.75rem; + font-weight: normal; + white-space: nowrap; + border-right-style: solid; + border-right-width: 0.125rem; + border-color: #cb4b16; + padding-right: 0.75rem; + margin-top: -0.1rem; + margin-right: 0.75rem; + margin-bottom: 0.25rem; } -figure.m-figure img { - position: relative; - margin-left: 0; - margin-right: 0; - margin-bottom: 0; - border-top-left-radius: 0.2rem; - border-top-right-radius: 0.2rem; - max-width: 100%; +article > header .m-date-day { + display: block; + font-weight: bold; + padding-top: 0.2rem; + padding-bottom: 0.15rem; + font-size: 1.25rem; } -figure.m-figure.m-flat img { - border-bottom-left-radius: 0.2rem; - border-bottom-right-radius: 0.2rem; +article > header p { + color: #7a7a7a; + font-size: 1.125rem; } -figure.m-figure figcaption { - margin-top: 0.5rem; - margin-bottom: 0.5rem; - font-weight: normal; - font-size: 1.17rem; +article > header h1::after { + content: " "; + clear: both; + display: table; } -figure.m-figure a img { - margin-left: -1rem; - margin-right: -1rem; +article > footer { + color: #969696; } -figure.m-figure.m-fullwidth, figure.m-figure.m-fullwidth > * { - display: block; +article > footer p { + font-style: italic; + font-size: 0.85rem; + text-indent: 0; } -figure.m-figure.m-fullwidth > *:first-child { - display: inline; +article section:target { + margin-left: -1.0rem; + border-left-style: solid; + border-left-width: 0.25rem; + padding-left: 0.75rem; + border-color: #cb4b16; } -figure.m-figure.m-fullwidth img { - width: 100%; +article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, +article section > h4 a, article section > h5 a, article section > h6 a { + text-decoration: none; } -figure.m-figure.m-fullwidth:after { - content: ' '; - display: block; - margin-top: 1rem; - height: 1px; +#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { + background-size: cover; + background-color: #666666; + background-position: center center; + background-repeat: no-repeat; + margin-top: -4rem; + padding-top: 5rem; } -figure.m-code-figure, figure.m-console-figure { - margin-top: 0; - margin-left: 0; - margin-right: 0; - position: relative; - padding: 1rem; +#m-landing-image { + color: #ffffff; } -figure.m-code-figure:before, figure.m-console-figure:before { - position: absolute; - content: ' '; - top: 0; - bottom: 0; - left: 0; - right: 0; - z-index: -1; - border-style: solid; - border-width: 0.125rem; - border-radius: 0.2rem; +#m-cover-image { + height: 30rem; + margin-bottom: -26rem; } -figure.m-code-figure:before { - border-color: #fbf0ec; +#m-landing-cover h1 { + font-size: 2.8rem; + margin-top: -0.5rem; + padding-left: 1.5rem; + padding-bottom: 1rem; + text-transform: lowercase; } -figure.m-console-figure:before { - border-color: #000000; +#m-landing-cover { + padding-bottom: 10rem; + margin-bottom: -6rem; } -figure.m-code-figure.m-flat:before, figure.m-console-figure.m-flat:before { - border-color: transparent; +article#m-jumbo { + margin-top: -1rem; } -figure.m-code-figure > pre:first-child, figure.m-console-figure > pre:first-child { - position: relative; - margin: -1rem -1rem 1rem -1rem; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; +#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { + background: linear-gradient(transparent 0%, transparent 50%, #ffffff 100%); + width: 100%; + height: 100%; } -article section:target figure.m-code-figure, article section:target figure.m-console-figure { - z-index: 1; +article#m-jumbo > header h1, article#m-jumbo > header h2 { + text-align: center; + font-weight: bold; } -figure.m-figure.m-default:before { border-color: #fbf0ec; } -figure.m-figure.m-default figcaption { color: #000000; } -figure.m-figure.m-primary:before { border-color: #ef9069; } -figure.m-figure.m-primary figcaption { color: #cb4b16; } -figure.m-figure.m-success:before { border-color: #4dd376; } -figure.m-figure.m-success figcaption { color: #31c25d; } -figure.m-figure.m-warning:before { border-color: #d1d34d; } -figure.m-figure.m-warning figcaption { color: #c7cf2f; } -figure.m-figure.m-danger:before { border-color: #e23e3e; } -figure.m-figure.m-danger figcaption { color: #f60000; } -figure.m-figure.m-info:before { border-color: #4c93d3; } -figure.m-figure.m-info figcaption { color: #2e7dc5; } -figure.m-figure.m-dim:before { border-color: #f1f1f1; } -figure.m-figure.m-dim { color: #bdbdbd; } -figure.m-figure.m-dim a { color: #c0c0c0; } -figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m-dim a:active { - color: #949494; +article#m-jumbo > header a { + text-decoration: none; } -.m-imagegrid > div { - background-color: #ffffff; /* to avoid section HL shining through */ +article#m-jumbo > header #m-jumbo-cover { + padding-bottom: 5rem; } -.m-imagegrid > div > figure { - display: block; - float: left; - position: relative; - margin: 0; +article#m-jumbo > header #m-jumbo-image { + font-size: 2.5vmin; + margin-bottom: -3rem; } -.m-imagegrid > div > figure > div, -.m-imagegrid > div > figure > figcaption, -.m-imagegrid > div > figure > a > div, -.m-imagegrid > div > figure > a > figcaption { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - border-color: #ffffff; - border-style: solid; - border-width: 0.25rem; - padding: 0.5rem; +article#m-jumbo > header h1 { + font-size: 10vmin; } -.m-imagegrid > div > figure:first-child > div, -.m-imagegrid > div > figure:first-child > figcaption, -.m-imagegrid > div > figure:first-child > a > div, -.m-imagegrid > div > figure:first-child > a > figcaption { - border-left-width: 0; +article#m-jumbo > header h2 { + font-size: 3vmin; } -.m-imagegrid > div > figure:last-child > div, -.m-imagegrid > div > figure:last-child > figcaption, -.m-imagegrid > div > figure:last-child > a > div, -.m-imagegrid > div > figure:last-child > a > figcaption { - border-right-width: 0; +@media screen and (max-height: 640px) , screen and (max-width: 640px) { + article#m-jumbo > header h1 { + font-size: 3rem; + } + article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { + font-size: 1rem; + } } -.m-imagegrid > div > figure > figcaption, -.m-imagegrid > div > figure > a > figcaption { - color: transparent; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - font-size: 0.75rem; +article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { + color: #ffffff; } -.m-imagegrid > div > figure > div::before, -.m-imagegrid > div > figure > figcaption::before, -.m-imagegrid > div > figure > a > div::before, -.m-imagegrid > div > figure > a > figcaption::before { - content: ''; +article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { + color: #f0f0f0; +} +article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { + color: #000000; +} +article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { + color: #0f0f0f; +} +.m-landing-news h3 a { + color: #000000; + text-decoration: none; + text-transform: uppercase; +} +.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { + color: #cb4b16; +} +.m-landing-news time { display: inline-block; - height: 100%; - vertical-align: bottom; - width: 0; + margin-left: 1rem; + float: right; } -.m-imagegrid > div > figure:hover > figcaption, -.m-imagegrid > div > figure:hover > a > figcaption { - background: linear-gradient(transparent 0%, transparent 75%, rgba(0, 0, 0, 0.85) 100%); - color: #ffffff; +.m-article-pagination { + text-align: center; + padding: 1rem; } -.m-imagegrid > div > figure > img, -.m-imagegrid > div > figure > a > img { - width: 100%; - height: 100%; +nav.m-navpanel { + text-align: center; } -.m-imagegrid > div::after { - display: block; - content: ' '; - clear: both; +nav.m-navpanel h3 { + text-transform: uppercase; + font-weight: normal; } -@media screen and (max-width: 767px) { - .m-imagegrid > div > figure { - float: none; - width: 100% !important; - } - .m-imagegrid > div > figure > div, - .m-imagegrid > div > figure > figcaption, - .m-imagegrid > div > figure > a > div, - .m-imagegrid > div > figure > a > figcaption { - border-left-width: 0; - border-right-width: 0; - } +nav.m-navpanel ol { + text-transform: lowercase; } -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-note, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-frame, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-block, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-imagegrid, -.m-container-inflatable > .m-row > [class*='m-col-'] > pre, -.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-code-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-console-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-note, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-frame, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-block, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-imagegrid, -.m-container-inflatable > .m-row > [class*='m-col-'] section > pre, -.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-code-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-console-figure { - margin-left: -1rem; - margin-right: -1rem; +nav.m-navpanel ol, nav.m-navpanel ul { + list-style-type: none; + padding: 0; } -@media screen and (min-width: 576px) { - .m-container-inflatable > .m-row > .m-col-s-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-s-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +nav.m-navpanel a { + color: #292929; + text-decoration: none; } -@media screen and (min-width: 768px) { - .m-container-inflatable > .m-row > .m-col-m-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-m-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { + color: #cb4b16; } -@media screen and (min-width: 992px) { - .m-container-inflatable > .m-row > .m-col-l-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-l-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +ul.m-tagcloud li { display: inline; } +ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } +ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } +ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } +ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } +ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } +article section:target figure.m-code-figure, article section:target figure.m-console-figure { + z-index: 1; } +article, article > header, article section { margin-bottom: 1rem; } +article:last-child, article section:last-child { margin-bottom: 0; } .m-container-inflatable section:target > .m-note, .m-container-inflatable section:target > .m-frame, .m-container-inflatable section:target > .m-block, @@ -1720,101 +1815,6 @@ figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m- .m-container-inflatable section:target section > .m-note.m-dim { border-left-color: #bdbdbd; } -pre.m-code span.hll { - margin-left: -1.0rem; - margin-right: -1.0rem; - padding-left: 1.0rem; -} -pre.m-code.m-inverted { - color: rgba(91, 91, 91, 0.33); -} -pre.m-code.m-inverted > span { - opacity: 0.3333; -} -pre.m-code.m-inverted > span.hll { - color: #000000; - opacity: 1; - background-color: transparent; - border-color: transparent; -} -div.m-math { - overflow-x: auto; - overflow-y: hidden; - text-align: center; -} -div.m-plot svg { - text-align: center; -} -div.m-plot .m-background { - fill: #fbf0ec; -} -div.m-plot svg .m-label { font-size: 11px; } -div.m-plot svg .m-title { font-size: 13px; } -div.m-plot svg .m-label, div.m-plot svg .m-title { fill: #000000; } -div.m-plot svg .m-line { - stroke: #000000; - stroke-width: 0.8; -} -div.m-plot svg .m-error { - stroke: #000000; - stroke-width: 1.5; -} -div.m-plot svg .m-label.m-dim { fill: #bdbdbd; } -div.m-math svg, svg.m-math { fill: #000000; } -div.m-math.m-default svg, svg.m-math.m-default, div.m-plot svg .m-bar.m-default { - fill: #000000; -} -div.m-math.m-primary svg, svg.m-math.m-primary, div.m-plot svg .m-bar.m-primary { - fill: #cb4b16; -} -div.m-math.m-success svg, svg.m-math.m-success, div.m-plot svg .m-bar.m-success { - fill: #31c25d; -} -div.m-math.m-warning svg, svg.m-math.m-warning, div.m-plot svg .m-bar.m-warning { - fill: #c7cf2f; -} -div.m-math.m-danger svg, svg.m-math.m-danger, div.m-plot svg .m-bar.m-danger { - fill: #f60000; -} -div.m-math.m-info svg, svg.m-math.m-info, div.m-plot svg .m-bar.m-info { - fill: #2e7dc5; -} -div.m-math.m-dim svg, svg.m-math.m-dim, div.m-plot svg .m-bar.m-dim { - fill: #bdbdbd; -} -p, ul, ol, dl, blockquote, pre, figure.m-code-figure, figure.m-console-figure, -hr, article, article > header, article section, -.m-note, .m-frame, .m-block, div.m-button, -div.m-scroll, table.m-table, div.m-image, img.m-image, svg.m-image, -figure.m-figure, .m-imagegrid, div.m-math { - margin-bottom: 1rem; -} -p:last-child, ul:last-child, ol:last-child, dl:last-child, blockquote:last-child, -pre:last-child, figure.m-code-figure:last-child, figure.m-console-figure:last-child, -hr:last-child, article:last-child, article section:last-child, -.m-note:last-child, .m-frame:last-child, .m-block:last-child, -div.m-button:last-child, div.m-scroll:last-child, table.m-table:last-child, -img.m-image:last-child, svg.m-image:last-child, div.m-image:last-child, -figure.m-figure:last-child, .m-imagegrid:last-child, div.m-math:last-child { - margin-bottom: 0; -} -li > p:last-child, li > blockquote:last-child, li > pre:last-child, -li > figure.m-code-figure:last-child, li > figure.m-console-figure:last-child, -li > .m-note:last-child, li > .m-frame:last-child, li > .m-block:last-child, -li > div.m-button:last-child, li > div.m-scroll:last-child, li > table.m-table:last-child, -li > img.m-image:last-child, li > svg.m-image:last-child, li > div.m-image:last-child, -li > figure.m-figure:last-child, li > div.m-math:last-child { - margin-bottom: 1rem; -} -li:last-child > p:last-child, li:last-child > blockquote:last-child, li:last-child > pre:last-child, -li:last-child > figure.m-code-figure:last-child, li:last-child > figure.m-console-figure:last-child, -li:last-child > .m-note:last-child, li:last-child > .m-frame:last-child, li:last-child > .m-block:last-child, -li:last-child > div.m-button:last-child, li:last-child > div.m-scroll:last-child, -li:last-child > table.m-table:last-child, li:last-child > img.m-image:last-child, -li:last-child > svg.m-image:last-child, li:last-child > div.m-image:last-child, -li:last-child > figure.m-figure:last-child, li:last-child > div.m-math:last-child { - margin-bottom: 0; -} .m-console .hll { background-color: #ffffcc } .m-console .g-AnsiBlack { color: #000000 } diff --git a/css/m-light.compiled.css b/css/m-light.compiled.css index 26388ae3..4b766f42 100644 --- a/css/m-light.compiled.css +++ b/css/m-light.compiled.css @@ -487,1172 +487,1267 @@ code { code.m-console { background-color: #000000; } -body > header > nav { +div.m-scroll { + max-width: 100%; + overflow-x: auto; +} +.m-fullwidth { width: 100%; - background-color: #ffffff; - min-height: 3rem; } -body > header > nav.m-navbar-landing, -body > header > nav.m-navbar-cover { - background-color: transparent; - position: relative; +.m-text-center, .m-text-center.m-noindent, table.m-table th.m-text-center, .m-text-center p { + text-align: center; } -body > header > nav.m-navbar-landing { - opacity: 0.8; +.m-text-left, .m-text-left.m-noindent, table.m-table th.m-text-left, .m-text-right p { + text-align: left; } -body > header > nav.m-navbar-cover { - background-color: rgba(255, 255, 255, 0.25); - opacity: 1; +.m-text-right, .m-text-right.m-noindent, table.m-table th.m-text-right, .m-text-right p { + text-align: right; } -body > header > nav.m-navbar-landing:hover, -body > header > nav.m-navbar-cover:hover { - background-color: rgba(255, 255, 255, 0.75); - opacity: 1; +.m-text-top, table.m-table th.m-text-top, table.m-table td.m-text-top { + vertical-align: top; } -body> header > nav.m-navbar-landing:target, -body> header > nav.m-navbar-cover:target { - background-color: #ffffff; - opacity: 1; +.m-text-middle, table.m-table th.m-text-middle, table.m-table td.m-text-middle { + vertical-align: middle; } -body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { - visibility: hidden; +.m-text-bottom, table.m-table th.m-text-bottom, table.m-table td.m-text-bottom { + vertical-align: bottom; } -body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { - visibility: visible; +.m-text.m-small { + font-size: 85.4%; } -body > header > nav { - margin-left: auto; - margin-right: auto; - color: #000000; +.m-text.m-big { + font-size: 117%; } -body > header > nav a { - text-decoration: none; - text-transform: lowercase; - display: inline-block; - vertical-align: middle; - line-height: 2.75rem; - color: #000000; +.m-text.m-strong { + font-weight: bold; } -body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { - text-transform: lowercase; - font-weight: normal; - font-size: 1.125rem; - padding-left: 1rem; - padding-right: 1rem; +.m-text.m-em { + font-style: italic; } -body > header > nav a#m-navbar-brand .m-thin { +h1 .m-thin, h2 .m-thin, h3 .m-thin, h4 .m-thin, h5 .m-thin, h6 .m-thin { font-weight: normal; } -body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { - content:'\2630'; +ul.m-unstyled, ol.m-unstyled { + list-style-type: none; + padding-left: 0; } -body > header > nav #m-navbar-collapse { - padding-bottom: 1rem; +ul[class*='m-block-'], ol[class*='m-block-'] { + padding-left: 0; } -body > header > nav #m-navbar-collapse li { - border-style: solid; - border-color: transparent; - border-width: 0 0 0 0.25rem; - margin-left: -1rem; +ul[class*='m-block-'] li, ol[class*='m-block-'] li { + display: inline; } -body > header > nav #m-navbar-collapse li a { - border-style: solid; - border-color: transparent; - line-height: 1.5rem; - margin-left: -0.25rem; - padding-left: 0.75rem; - border-width: 0 0 0 0.25rem; - width: 100%; +ul[class*='m-block-bar-'] li:not(:last-child)::after, ol[class*='m-block-bar-'] li:not(:last-child)::after { + content: " | "; } -body > header > nav #m-navbar-collapse li a#m-navbar-current { - color: #ea7944; - border-color: #ea7944; +@media screen and (min-width: 576px) { + ul.m-block-bar-s, ol.m-block-bar-s { padding-left: 2rem; } + ul.m-block-bar-s li, ol.m-block-bar-s li { display: list-item; } + ul.m-block-bar-s li:not(:last-child)::after, ol.m-block-bar-s li:not(:last-child)::after { content: ""; } } -body > header > nav ol { - list-style-type: none; - margin: 0; +@media screen and (min-width: 768px) { + ul.m-block-bar-m, ol.m-block-bar-m { padding-left: 2rem; } + ul.m-block-bar-m li, ol.m-block-bar-m li { display: list-item; } + ul.m-block-bar-m li:not(:last-child)::after, ol.m-block-bar-m li:not(:last-child)::after { content: ""; } } -body > header > nav ol ol { - padding-left: 1.5rem; +@media screen and (min-width: 992px) { + ul.m-block-bar-l, ol.m-block-bar-l { padding-left: 2rem; } + ul.m-block-bar-l li, ol.m-block-bar-l li { display: list-item; } + ul.m-block-bar-l li:not(:last-child)::after, ol.m-block-bar-l li:not(:last-child)::after { content: ""; } } -body > header > nav [class*='m-col-'] { - padding-top: 0; - padding-bottom: 0; +p.m-poem { + text-indent: 0; + text-align: left; + margin-left: 1.5rem; } -body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { - color: #cb4b16; +p.m-transition { + color: #f7e3db; + text-indent: 0; + text-align: center; + font-size: 2rem; } -body > header > nav #m-navbar-collapse li:hover { - border-color: #cb4b16; +dl.m-diary { + margin-bottom: 1.25rem; } -body > header > nav #m-navbar-collapse li a:hover, -body > header > nav #m-navbar-collapse li a:focus, -body > header > nav #m-navbar-collapse li a:active { - border-color: #cb4b16; - background-color: rgba(255, 255, 255, 0.5); +dl.m-diary:last-child { + margin-bottom: 0.25rem; } -body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, -body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, -body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { - background-color: var(--header-link-active-background-color-semi); +dl.m-diary dt { + font-weight: bold; + width: 3.5rem; + float: left; + clear: both; + padding-top: 0.25rem; } -body > header > nav #m-navbar-hide { - display: none; +dl.m-diary dd { + padding-top: 0.25rem; + padding-left: 3.5rem; } -body > header > nav:target #m-navbar-collapse { - display: block; +.m-note { + border-radius: 0.2rem; + padding: 1rem; } -body > header > nav:target #m-navbar-show { - display: none; +.m-note pre, .m-note code { + background-color: rgba(251, 240, 236, 0.5); } -body > header > nav:target #m-navbar-hide { - display: inline-block; +.m-frame { + background-color: #ffffff; + border-style: solid; + border-width: 0.125rem; + border-radius: 0.2rem; + border-color: #f7e3db; + padding: 0.875rem; } -@media screen and (min-width: 768px) { - body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, - body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { - display: none; - } - body > header > nav #m-navbar-collapse li a { - line-height: 2.75rem; - } - body > header > nav a, body > header > nav #m-navbar-collapse li a { - margin-left: 0; - padding-left: 1rem; - padding-right: 1rem; - white-space: nowrap; - } - body > header > nav #m-navbar-collapse { - padding-bottom: 0; - } - body > header > nav #m-navbar-collapse li ol { - background-color: #ffffff; - } - body > header > nav #m-navbar-collapse ol ol li { - margin-left: 0; - padding-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse ol ol li a { - padding-left: 0.75rem; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li { - margin-left: 0; - border-left-width: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol > li > a { - border-width: 0.25rem 0 0 0; - } - body > header > nav #m-navbar-collapse ol { - padding-left: 0; - padding-right: 0; - } - body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { - float: left; - } - body > header > nav #m-navbar-collapse ol ol { - z-index: 99999; - position: absolute; - visibility: hidden; - } - body > header > nav #m-navbar-collapse li:hover ol { - visibility: visible; - } +.m-block { + border-style: solid; + border-width: 0.0625rem; + border-left-width: 0.25rem; + border-radius: 0.2rem; + border-color: #f7e3db; + padding: 0.9375rem 0.9375rem 0.9375rem 0.75rem; } -body > footer { - width: 100%; +.m-block.m-badge::after { + content: ' '; + display: block; + clear: both; } -body > footer > nav { - padding-top: 1rem; - padding-bottom: 1rem; - font-size: 0.85rem; - text-align: center; - color: #7c7c7c; - background-color: #eeeeee; +.m-block.m-badge h3 { + margin-left: 5rem; } -body > footer > nav h3, body > footer > nav h3 a { - text-transform: uppercase; - font-weight: normal; +.m-block.m-badge p { + margin-left: 5rem; + text-indent: 0; } -body > footer > nav ul { - list-style-type: none; - padding: 0; - margin: 0; +.m-block.m-badge img { + width: 4rem; + height: 4rem; + border-radius: 2rem; + float: left; } -body > footer > nav a { +div.m-button { + text-align: center; +} +div.m-button a { + display: inline-block; + border-radius: 0.2rem; + padding-top: 0.75rem; + padding-bottom: 0.75rem; + padding-left: 1.5rem; + padding-right: 1.5rem; text-decoration: none; - text-transform: lowercase; - color: #191919; + font-size: 1.17rem; } -body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { - color: #494949; +div.m-button.m-fullwidth a { + display: block; + padding-left: 0.5rem; + padding-right: 0.5rem; } -body > main { - padding-top: 1rem; - padding-bottom: 1rem; +div.m-button a .m-big:first-child { + font-size: 1.37rem; + font-weight: bold; } -article h1 { - font-size: 1.75rem; +div.m-button a .m-small:last-child { + font-size: 0.854rem; } -article h1 .m-breadcrumb { - color: #bdbdbd; +.m-label { + border-radius: 0.2rem; + font-size: 75%; font-weight: normal; + padding: 0.125rem 0.25rem; + vertical-align: 7.5%; } -article h1 .m-breadcrumb a { - color: #cb4b16; +.m-label.m-flat { + border-width: 0.0625rem; + border-style: solid; + border-color: #bdbdbd; + padding: 0.0625rem 0.1875rem; } -article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { - color: #802f0e; +table.m-table { + border-collapse: collapse; + margin-left: auto; + margin-right: auto; } -article > header h1 { - font-size: 2rem; - margin-bottom: 0.5rem; +table.m-table.m-big { + margin-top: 1.75rem; } -article h1 a, article > header h1, article > header h1 a, -article section > h2, article section > h2 a, -article section > h3, article section > h3 a, -article section > h4, article section > h4 a, -article section > h5, article section > h5 a, -article section > h6, article section > h6 a { - color: #cb4b16; +div.m-scroll > table.m-table:last-child { + margin-bottom: 0.0625rem; } -article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, -article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, -article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, -article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, -article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, -article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { - color: #802f0e; +table.m-table:not(.m-flat) tbody tr:hover { + background-color: #f7e3db; } -article > header .m-date { - display: block; - width: 2.5rem; - float: left; - text-align: center; - line-height: 95%; - font-size: 0.75rem; - font-weight: normal; - white-space: nowrap; - border-right-style: solid; - border-right-width: 0.125rem; - border-color: #cb4b16; - padding-right: 0.75rem; - margin-top: -0.1rem; - margin-right: 0.75rem; - margin-bottom: 0.25rem; +table.m-table th, table.m-table td { + vertical-align: top; + border-style: solid; + border-top-width: 0.0625rem; + border-left-width: 0; + border-right-width: 0; + border-bottom-width: 0; + border-color: #f7e3db; } -article > header .m-date-day { - display: block; - font-weight: bold; - padding-top: 0.2rem; - padding-bottom: 0.15rem; - font-size: 1.25rem; +table.m-table caption { + padding-bottom: 0.5rem; } -article > header p { - color: #7a7a7a; - font-size: 1.125rem; +table.m-table thead tr:first-child th, table.m-table thead tr:first-child td { + border-top-width: 0.125rem; } -article > header h1::after { - content: " "; - clear: both; - display: table; +table.m-table thead th, table.m-table thead td { + border-bottom-width: 0.125rem; + vertical-align: bottom; } -article > footer { - color: #969696; +table.m-table tfoot th, table.m-table tfoot td { + border-top-width: 0.125rem; } -article > footer p { - font-style: italic; - font-size: 0.85rem; - text-indent: 0; +table.m-table th, table.m-table td { + padding: 0.5rem; } -article section:target { - margin-left: -1.0rem; - border-left-style: solid; - border-left-width: 0.25rem; - padding-left: 0.75rem; - border-color: #cb4b16; +table.m-table.m-big th, table.m-table.m-big td { + padding: 0.75rem 1rem; } -article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, -article section > h4 a, article section > h5 a, article section > h6 a { - text-decoration: none; +table.m-table th { + text-align: left; } -#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { - background-size: cover; - background-color: #666666; - background-position: center center; - background-repeat: no-repeat; - margin-top: -4rem; - padding-top: 5rem; +table.m-table th.m-thin { + font-weight: normal; } -#m-landing-image { - color: #ffffff; +table.m-table td.m-default, table.m-table th.m-default, +table.m-table td.m-primary, table.m-table th.m-primary, +table.m-table td.m-success, table.m-table th.m-success, +table.m-table td.m-warning, table.m-table th.m-warning, +table.m-table td.m-danger, table.m-table th.m-danger, +table.m-table td.m-info, table.m-table th.m-info, +table.m-table td.m-dim, table.m-table th.m-dim { + padding-left: 0.4375rem; + padding-right: 0.4375rem; + border-left-width: 0.0625rem; } -#m-cover-image { - height: 30rem; - margin-bottom: -26rem; +table.m-table.m-big td.m-default, table.m-table.m-big th.m-default, +table.m-table.m-big td.m-primary, table.m-table.m-big th.m-primary, +table.m-table.m-big td.m-success, table.m-table.m-big th.m-success, +table.m-table.m-big td.m-warning, table.m-table.m-big th.m-warning, +table.m-table.m-big td.m-danger, table.m-table.m-big th.m-danger, +table.m-table.m-big td.m-info, table.m-table.m-big th.m-info, +table.m-table.m-big td.m-dim, table.m-table.m-big th.m-dim { + padding-left: 0.9375rem; + padding-right: 0.9375rem; + border-left-width: 0.0625rem; } -#m-landing-cover h1 { - font-size: 2.8rem; - margin-top: -0.5rem; - padding-left: 1.5rem; - padding-bottom: 1rem; - text-transform: lowercase; +table.m-table tr.m-default td, table.m-table td.m-default, +table.m-table tr.m-default th, table.m-table th.m-default, +table.m-table tr.m-primary td, table.m-table td.m-primary, +table.m-table tr.m-primary th, table.m-table th.m-primary, +table.m-table tr.m-success td, table.m-table td.m-success, +table.m-table tr.m-success th, table.m-table th.m-success, +table.m-table tr.m-warning td, table.m-table td.m-warning, +table.m-table tr.m-warning th, table.m-table th.m-warning, +table.m-table tr.m-danger td, table.m-table td.m-danger, +table.m-table tr.m-danger th, table.m-table th.m-danger, +table.m-table tr.m-info td, table.m-table td.m-info, +table.m-table tr.m-info th, table.m-table th.m-info, +table.m-table tr.m-dim td, table.m-table td.m-dim, +table.m-table tr.m-dim th, table.m-table th.m-dim { + border-color: #ffffff; } -#m-landing-cover { - padding-bottom: 10rem; - margin-bottom: -6rem; +.m-block.m-default { border-left-color: #f7e3db; } +.m-block.m-default h3, .m-block.m-default h4, .m-block.m-default h5, .m-block.m-default h6 { + color: #000000; } -article#m-jumbo { - margin-top: -1rem; +.m-block.m-primary { border-left-color: #cb4b16; } +.m-block.m-primary h3, .m-block.m-primary h4, .m-block.m-primary h5, .m-block.m-primary h6 { + color: #cb4b16; } -#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { - background: linear-gradient(transparent 0%, transparent 50%, #ffffff 100%); - width: 100%; - height: 100%; +.m-block.m-success { border-left-color: #31c25d; } +.m-block.m-success h3, .m-block.m-success h4, .m-block.m-success h5, .m-block.m-success h6 { + color: #31c25d; } -article#m-jumbo > header h1, article#m-jumbo > header h2 { - text-align: center; - font-weight: bold; +.m-block.m-warning { border-left-color: #c7cf2f; } +.m-block.m-warning h3, .m-block.m-warning h4, .m-block.m-warning h5, .m-block.m-warning h6 { + color: #c7cf2f; } -article#m-jumbo > header a { - text-decoration: none; +.m-block.m-danger { border-left-color: #f60000; } +.m-block.m-danger h3, .m-block.m-danger h4, .m-block.m-danger h5, .m-block.m-danger h6 { + color: #f60000; } -article#m-jumbo > header #m-jumbo-cover { - padding-bottom: 5rem; +.m-block.m-info { border-left-color: #2e7dc5; } +.m-block.m-info h3, .m-block.m-info h4, .m-block.m-info h5, .m-block.m-info h6 { + color: #2e7dc5; } -article#m-jumbo > header #m-jumbo-image { - font-size: 2.5vmin; - margin-bottom: -3rem; +.m-block.m-dim { + border-left-color: #bdbdbd; + color: #bdbdbd; } -article#m-jumbo > header h1 { - font-size: 10vmin; +.m-block.m-dim a { color: #c0c0c0; } +.m-block.m-dim a:hover, .m-block.m-dim a:focus, .m-block.m-dim a:active { + color: #949494; } -article#m-jumbo > header h2 { - font-size: 3vmin; +.m-block.m-flat { border-color: transparent; } +.m-block.m-flat h3, .m-block.m-flat h4, .m-block.m-flat h5. .m-block.m-flat h6 { + color: #000000; } -@media screen and (max-height: 640px) , screen and (max-width: 640px) { - article#m-jumbo > header h1 { - font-size: 3rem; - } - article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { - font-size: 1rem; - } +.m-note.m-default { background-color: #fbf0ec; } +.m-note.m-default, +table.m-table tr.m-default td, table.m-table td.m-default, +table.m-table tr.m-default th, table.m-table th.m-default { + color: #000000; } -article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { - color: #ffffff; +.m-note.m-default a:hover, +table.m-table tr.m-default td a:hover, table.m-table td.m-default a:hover, +table.m-table tr.m-default th a:hover, table.m-table th.m-default a:hover, +.m-note.m-default a:focus, +table.m-table tr.m-default td a:focus, table.m-table td.m-default a:focus, +table.m-table tr.m-default th a:focus, table.m-table th.m-default a:focus, +.m-note.m-default a:active, +table.m-table tr.m-default td a:active, table.m-table td.m-default a:active, +table.m-table tr.m-default th a:active, table.m-table th.m-default a:active { + color: #cb4b16; } -article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { - color: #f0f0f0; +.m-note.m-primary a, +table.m-table tr.m-primary td a, table.m-table td.m-primary a, +table.m-table tr.m-primary th a, table.m-table th.m-primary a { + color: #ea7944; } -article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { - color: #000000; +.m-note.m-primary, +table.m-table tr.m-primary td, table.m-table td.m-primary, +table.m-table tr.m-primary th, table.m-table th.m-primary { + background-color: #ef9069; + color: #fbe4d9; } -article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { - color: #0f0f0f; +.m-note.m-primary a, +table.m-table tr.m-primary td a, table.m-table td.m-primary a, +table.m-table tr.m-primary th a, table.m-table th.m-primary a { + color: #782f0d; } -.m-landing-news h3 a { - color: #000000; - text-decoration: none; - text-transform: uppercase; +.m-note.m-primary a:hover, +table.m-table tr.m-primary td a:hover, table.m-table td.m-primary a:hover, +table.m-table tr.m-primary th a:hover, table.m-table th.m-primary a:hover, +.m-note.m-primary a:focus, +table.m-table tr.m-primary td a:focus, table.m-table td.m-primary a:focus, +table.m-table tr.m-primary th a:focus, table.m-table th.m-primary a:focus, +.m-note.m-primary a:active, +table.m-table tr.m-primary td a:active, table.m-table td.m-primary a:active, +table.m-table tr.m-primary th a:active, table.m-table th.m-primary a:active { + color: #2f1205; } -.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { - color: #cb4b16; +.m-note.m-success, +table.m-table tr.m-success td, table.m-table td.m-success, +table.m-table tr.m-success th, table.m-table th.m-success { + background-color: #4dd376; + color: #f4fcf6; } -.m-landing-news time { - display: inline-block; - margin-left: 1rem; - float: right; +.m-note.m-success a, +table.m-table tr.m-success td a, table.m-table td.m-success a, +table.m-table tr.m-success th a, table.m-table th.m-success a { + color: #c5f2d1; } -.m-article-pagination { - text-align: center; - padding: 1rem; +.m-note.m-success a:hover, +table.m-table tr.m-success td a:hover, table.m-table td.m-success a:hover, +table.m-table tr.m-success th a:hover, table.m-table th.m-success a:hover, +.m-note.m-success a:focus, +table.m-table tr.m-success td a:focus, table.m-table td.m-success a:focus, +table.m-table tr.m-success th a:focus, table.m-table th.m-success a:focus, +.m-note.m-success a:active, +table.m-table tr.m-success td a:active, table.m-table td.m-success a:active, +table.m-table tr.m-success th a:active, table.m-table th.m-success a:active { + color: #dcf6e3; } -nav.m-navpanel { - text-align: center; +.m-note.m-warning, table.m-table tr.m-warning td, table.m-table td.m-warning, + table.m-table tr.m-warning th, table.m-table th.m-warning { + background-color: #d1d34d; + color: #fcfcf4; } -nav.m-navpanel h3 { - text-transform: uppercase; - font-weight: normal; +.m-note.m-warning a, table.m-table tr.m-warning td a, table.m-table td.m-warning a, + table.m-table tr.m-warning th a, table.m-table th.m-warning a { + color: #f0f1c7; } -nav.m-navpanel ol { - text-transform: lowercase; +.m-note.m-warning a:hover, +table.m-table tr.m-warning td a:hover, table.m-table td.m-warning a:hover, +table.m-table tr.m-warning th a:hover, table.m-table th.m-warning a:hover, +.m-note.m-warning a:focus, +table.m-table tr.m-warning td a:focus, table.m-table td.m-warning a:focus, +table.m-table tr.m-warning th a:focus, table.m-table th.m-warning a:focus, +.m-note.m-warning a:active, +table.m-table tr.m-warning td a:active, table.m-table td.m-warning a:active, +table.m-table tr.m-warning th a:active, table.m-table th.m-warning a:active { + color: #f6f6dc; } -nav.m-navpanel ol, nav.m-navpanel ul { - list-style-type: none; - padding: 0; +.m-note.m-danger, +table.m-table tr.m-danger td, table.m-table td.m-danger, +table.m-table tr.m-danger th, table.m-table th.m-danger { + background-color: #e23e3e; + color: #fdf3f3; } -nav.m-navpanel a { - color: #292929; - text-decoration: none; +.m-note.m-danger a, +table.m-table tr.m-danger td a, table.m-table td.m-danger a, +table.m-table tr.m-danger th a, table.m-table th.m-danger a { + color: #f2c7c6; } -nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { - color: #cb4b16; +.m-note.m-danger a:hover, +table.m-table tr.m-danger td a:hover, table.m-table td.m-danger a:hover, +table.m-table tr.m-danger th a:hover, table.m-table th.m-danger a:hover, +.m-note.m-danger a:focus, +table.m-table tr.m-danger td a:focus, table.m-table td.m-danger a:focus, +table.m-table tr.m-danger th a:focus, table.m-table th.m-danger a:focus, +.m-note.m-danger a:active, +table.m-table tr.m-danger td a:active, table.m-table td.m-danger a:active, +table.m-table tr.m-danger th a:active, table.m-table th.m-danger a:active { + color: #f6dddc; } -ul.m-tagcloud li { display: inline; } -ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } -ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } -ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } -ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } -ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } -div.m-scroll { - max-width: 100%; - overflow-x: auto; +.m-note.m-info, +table.m-table tr.m-info td, table.m-table td.m-info, +table.m-table tr.m-info th, table.m-table th.m-info { + background-color: #4c93d3; + color: #f4f8fc; } -.m-fullwidth { - width: 100%; +.m-note.m-info a, +table.m-table tr.m-info td a, table.m-table td.m-info a, +table.m-table tr.m-info th a, table.m-table th.m-info a { + color: #c6ddf2; } -.m-text-center, .m-text-center.m-noindent, table.m-table th.m-text-center, .m-text-center p { - text-align: center; +.m-note.m-info a:hover, +table.m-table tr.m-info td a:hover, table.m-table td.m-info a:hover, +table.m-table tr.m-info th a:hover, table.m-table th.m-info a:hover, +.m-note.m-info a:focus, +table.m-table tr.m-info td a:focus, table.m-table td.m-info a:focus, +table.m-table tr.m-info th a:focus, table.m-table th.m-info a:focus, +.m-note.m-info a:active, +table.m-table tr.m-info td a:active, table.m-table td.m-info a:active, +table.m-table tr.m-info th a:active, table.m-table th.m-info a:active { + color: #dbeaf7; } -.m-text-left, .m-text-left.m-noindent, table.m-table th.m-text-left, .m-text-right p { - text-align: left; +.m-note.m-dim, +table.m-table tr.m-dim td, table.m-table td.m-dim, +table.m-table tr.m-dim th, table.m-table th.m-dim { + background-color: #f1f1f1; + color: #7c7c7c; } -.m-text-right, .m-text-right.m-noindent, table.m-table th.m-text-right, .m-text-right p { - text-align: right; +.m-note.m-dim a, +table.m-table tr.m-dim td a, table.m-table td.m-dim a, +table.m-table tr.m-dim th a, table.m-table th.m-dim a { + color: #c0c0c0; } -.m-text-top, table.m-table th.m-text-top, table.m-table td.m-text-top { - vertical-align: top; +.m-note.m-dim a:hover, +table.m-table tr.m-dim td a:hover, table.m-table td.m-dim a:hover, +table.m-table tr.m-dim th a:hover, table.m-table th.m-dim a:hover, +.m-note.m-dim a:focus, +table.m-table tr.m-dim td a:focus, table.m-table td.m-dim a:focus, +table.m-table tr.m-dim th a:focus, table.m-table th.m-dim a:focus, +.m-note.m-dim a:active, +table.m-table tr.m-dim td a:active, table.m-table td.m-dim a:active, +table.m-table tr.m-dim th a:active, table.m-table th.m-dim a:active { + color: #949494; } -.m-text-middle, table.m-table th.m-text-middle, table.m-table td.m-text-middle { - vertical-align: middle; +.m-text.m-default, .m-label.m-flat.m-default { color: #000000; } +.m-text.m-primary, .m-label.m-flat.m-primary { color: #cb4b16; } +.m-text.m-success, .m-label.m-flat.m-success { color: #31c25d; } +.m-text.m-warning, .m-label.m-flat.m-warning { color: #c7cf2f; } +.m-text.m-danger, .m-label.m-flat.m-danger { color: #f60000; } +.m-text.m-info, .m-label.m-flat.m-info { color: #2e7dc5; } +.m-text.m-dim, .m-label.m-flat.m-dim { color: #bdbdbd; } +.m-text.m-dim a { color: #c0c0c0; } +.m-text.m-dim a:hover, .m-text.m-dim a:focus, .m-text.m-dim a:active { + color: #949494; } -.m-text-bottom, table.m-table th.m-text-bottom, table.m-table td.m-text-bottom { - vertical-align: bottom; +div.m-button a, .m-label { color: #ffffff; } +div.m-button.m-flat a { color: #000000; } +div.m-button.m-flat a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { + color: #cb4b16; } -.m-text.m-small { - font-size: 85.4%; +div.m-button.m-default a, .m-label:not(.m-flat).m-default { background-color: #000000; } +div.m-button.m-primary a, .m-label:not(.m-flat).m-primary { background-color: #cb4b16; } +div.m-button.m-success a, .m-label:not(.m-flat).m-success { background-color: #31c25d; } +div.m-button.m-warning a, .m-label:not(.m-flat).m-warning { background-color: #c7cf2f; } +div.m-button.m-danger a, .m-label:not(.m-flat).m-danger { background-color: #f60000; } +div.m-button.m-info a, .m-label:not(.m-flat).m-info { background-color: #2e7dc5; } +div.m-button.m-dim a, .m-label:not(.m-flat).m-dim { background-color: #bdbdbd; } +div.m-button.m-default a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { + background-color: #cb4b16; } -.m-text.m-big { - font-size: 117%; +div.m-button.m-primary a:hover, div.m-button.m-primary a:focus, div.m-button.m-primary a:active { + background-color: #000000; } -.m-text.m-strong { - font-weight: bold; +div.m-button.m-success a:hover, div.m-button.m-success a:focus, div.m-button.m-success a:active { + background-color: #dcf6e3; } -.m-text.m-em { - font-style: italic; +div.m-button.m-warning a:hover, div.m-button.m-warning a:focus, div.m-button.m-warning a:active { + background-color: #f6f6dc; } -h1 .m-thin, h2 .m-thin, h3 .m-thin, h4 .m-thin, h5 .m-thin, h6 .m-thin { - font-weight: normal; +div.m-button.m-danger a:hover, div.m-button.m-danger a:focus, div.m-button.m-danger a:active { + background-color: #f6dddc; } -ul.m-unstyled, ol.m-unstyled { - list-style-type: none; - padding-left: 0; +div.m-button.m-info a:hover, div.m-button.m-info a:focus, div.m-button.m-info a:active { + background-color: #c6ddf2; } -ul[class*='m-block-'], ol[class*='m-block-'] { - padding-left: 0; +div.m-button.m-dim a:hover, div.m-button.m-dim a:focus, div.m-button.m-dim a:active { + background-color: #c0c0c0; } -ul[class*='m-block-'] li, ol[class*='m-block-'] li { - display: inline; +img.m-image, svg.m-image { + display: block; + margin-left: auto; + margin-right: auto; } -ul[class*='m-block-bar-'] li:not(:last-child)::after, ol[class*='m-block-bar-'] li:not(:last-child)::after { - content: " | "; +div.m-image { + text-align: center; } -@media screen and (min-width: 576px) { - ul.m-block-bar-s, ol.m-block-bar-s { padding-left: 2rem; } - ul.m-block-bar-s li, ol.m-block-bar-s li { display: list-item; } - ul.m-block-bar-s li:not(:last-child)::after, ol.m-block-bar-s li:not(:last-child)::after { content: ""; } -} -@media screen and (min-width: 768px) { - ul.m-block-bar-m, ol.m-block-bar-m { padding-left: 2rem; } - ul.m-block-bar-m li, ol.m-block-bar-m li { display: list-item; } - ul.m-block-bar-m li:not(:last-child)::after, ol.m-block-bar-m li:not(:last-child)::after { content: ""; } -} -@media screen and (min-width: 992px) { - ul.m-block-bar-l, ol.m-block-bar-l { padding-left: 2rem; } - ul.m-block-bar-l li, ol.m-block-bar-l li { display: list-item; } - ul.m-block-bar-l li:not(:last-child)::after, ol.m-block-bar-l li:not(:last-child)::after { content: ""; } -} -p.m-poem { - text-indent: 0; - text-align: left; - margin-left: 1.5rem; -} -p.m-transition { - color: #f7e3db; - text-indent: 0; - text-align: center; - font-size: 2rem; -} -dl.m-diary { - margin-bottom: 1.25rem; -} -dl.m-diary:last-child { - margin-bottom: 0.25rem; -} -dl.m-diary dt { - font-weight: bold; - width: 3.5rem; - float: left; - clear: both; - padding-top: 0.25rem; -} -dl.m-diary dd { - padding-top: 0.25rem; - padding-left: 3.5rem; -} -.m-note { +img.m-image, svg.m-image, div.m-image img { + max-width: 100%; border-radius: 0.2rem; - padding: 1rem; } -.m-note pre, .m-note code { - background-color: rgba(251, 240, 236, 0.5); +div.m-image.m-fullwidth img, div.m-image.m-fullwidth svg { + width: 100%; } -.m-frame { - background-color: #ffffff; +figure.m-figure { + max-width: 100%; + margin-top: 0; + margin-left: auto; + margin-right: auto; + position: relative; + display: table; +} +figure.m-figure:before { + position: absolute; + content: ' '; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: -1; border-style: solid; border-width: 0.125rem; border-radius: 0.2rem; border-color: #f7e3db; - padding: 0.875rem; } -.m-block { - border-style: solid; - border-width: 0.0625rem; - border-left-width: 0.25rem; - border-radius: 0.2rem; - border-color: #f7e3db; - padding: 0.9375rem 0.9375rem 0.9375rem 0.75rem; +figure.m-figure.m-flat:before { + border-color: transparent; } -.m-block.m-badge::after { - content: ' '; - display: block; - clear: both; +figure.m-figure > * { + margin-left: 1rem; + margin-right: 1rem; + display: table-caption; + caption-side: bottom; } -.m-block.m-badge h3 { - margin-left: 5rem; +figure.m-figure > *:first-child { + display: inline; } -.m-block.m-badge p { - margin-left: 5rem; - text-indent: 0; +figure.m-figure > *:last-child { + margin-bottom: 1rem; } -.m-block.m-badge img { - width: 4rem; - height: 4rem; - border-radius: 2rem; - float: left; +figure.m-figure img { + position: relative; + margin-left: 0; + margin-right: 0; + margin-bottom: 0; + border-top-left-radius: 0.2rem; + border-top-right-radius: 0.2rem; + max-width: 100%; } -div.m-button { - text-align: center; +figure.m-figure.m-flat img { + border-bottom-left-radius: 0.2rem; + border-bottom-right-radius: 0.2rem; } -div.m-button a { - display: inline-block; - border-radius: 0.2rem; - padding-top: 0.75rem; - padding-bottom: 0.75rem; - padding-left: 1.5rem; - padding-right: 1.5rem; - text-decoration: none; +figure.m-figure figcaption { + margin-top: 0.5rem; + margin-bottom: 0.5rem; + font-weight: normal; font-size: 1.17rem; } -div.m-button.m-fullwidth a { - display: block; - padding-left: 0.5rem; - padding-right: 0.5rem; +figure.m-figure a img { + margin-left: -1rem; + margin-right: -1rem; } -div.m-button a .m-big:first-child { - font-size: 1.37rem; - font-weight: bold; +figure.m-figure.m-fullwidth, figure.m-figure.m-fullwidth > * { + display: block; } -div.m-button a .m-small:last-child { - font-size: 0.854rem; +figure.m-figure.m-fullwidth > *:first-child { + display: inline; } -.m-label { - border-radius: 0.2rem; - font-size: 75%; - font-weight: normal; - padding: 0.125rem 0.25rem; - vertical-align: 7.5%; +figure.m-figure.m-fullwidth img { + width: 100%; } -.m-label.m-flat { - border-width: 0.0625rem; - border-style: solid; - border-color: #bdbdbd; - padding: 0.0625rem 0.1875rem; +figure.m-figure.m-fullwidth:after { + content: ' '; + display: block; + margin-top: 1rem; + height: 1px; } -table.m-table { - border-collapse: collapse; - margin-left: auto; - margin-right: auto; +figure.m-code-figure, figure.m-console-figure { + margin-top: 0; + margin-left: 0; + margin-right: 0; + position: relative; + padding: 1rem; } -table.m-table.m-big { - margin-top: 1.75rem; +figure.m-code-figure:before, figure.m-console-figure:before { + position: absolute; + content: ' '; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: -1; + border-style: solid; + border-width: 0.125rem; + border-radius: 0.2rem; } -div.m-scroll > table.m-table:last-child { - margin-bottom: 0.0625rem; +figure.m-code-figure:before { + border-color: #fbf0ec; } -table.m-table:not(.m-flat) tbody tr:hover { - background-color: #f7e3db; +figure.m-console-figure:before { + border-color: #000000; } -table.m-table th, table.m-table td { - vertical-align: top; - border-style: solid; - border-top-width: 0.0625rem; - border-left-width: 0; - border-right-width: 0; - border-bottom-width: 0; - border-color: #f7e3db; +figure.m-code-figure.m-flat:before, figure.m-console-figure.m-flat:before { + border-color: transparent; } -table.m-table caption { - padding-bottom: 0.5rem; +figure.m-code-figure > pre:first-child, figure.m-console-figure > pre:first-child { + position: relative; + margin: -1rem -1rem 1rem -1rem; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; } -table.m-table thead tr:first-child th, table.m-table thead tr:first-child td { - border-top-width: 0.125rem; +figure.m-figure.m-default:before { border-color: #fbf0ec; } +figure.m-figure.m-default figcaption { color: #000000; } +figure.m-figure.m-primary:before { border-color: #ef9069; } +figure.m-figure.m-primary figcaption { color: #cb4b16; } +figure.m-figure.m-success:before { border-color: #4dd376; } +figure.m-figure.m-success figcaption { color: #31c25d; } +figure.m-figure.m-warning:before { border-color: #d1d34d; } +figure.m-figure.m-warning figcaption { color: #c7cf2f; } +figure.m-figure.m-danger:before { border-color: #e23e3e; } +figure.m-figure.m-danger figcaption { color: #f60000; } +figure.m-figure.m-info:before { border-color: #4c93d3; } +figure.m-figure.m-info figcaption { color: #2e7dc5; } +figure.m-figure.m-dim:before { border-color: #f1f1f1; } +figure.m-figure.m-dim { color: #bdbdbd; } +figure.m-figure.m-dim a { color: #c0c0c0; } +figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m-dim a:active { + color: #949494; } -table.m-table thead th, table.m-table thead td { - border-bottom-width: 0.125rem; - vertical-align: bottom; +.m-imagegrid > div { + background-color: #ffffff; /* to avoid section HL shining through */ } -table.m-table tfoot th, table.m-table tfoot td { - border-top-width: 0.125rem; +.m-imagegrid > div > figure { + display: block; + float: left; + position: relative; + margin: 0; } -table.m-table th, table.m-table td { +.m-imagegrid > div > figure > div, +.m-imagegrid > div > figure > figcaption, +.m-imagegrid > div > figure > a > div, +.m-imagegrid > div > figure > a > figcaption { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + border-color: #ffffff; + border-style: solid; + border-width: 0.25rem; padding: 0.5rem; } -table.m-table.m-big th, table.m-table.m-big td { - padding: 0.75rem 1rem; +.m-imagegrid > div > figure:first-child > div, +.m-imagegrid > div > figure:first-child > figcaption, +.m-imagegrid > div > figure:first-child > a > div, +.m-imagegrid > div > figure:first-child > a > figcaption { + border-left-width: 0; } -table.m-table th { - text-align: left; +.m-imagegrid > div > figure:last-child > div, +.m-imagegrid > div > figure:last-child > figcaption, +.m-imagegrid > div > figure:last-child > a > div, +.m-imagegrid > div > figure:last-child > a > figcaption { + border-right-width: 0; } -table.m-table th.m-thin { - font-weight: normal; +.m-imagegrid > div > figure > figcaption, +.m-imagegrid > div > figure > a > figcaption { + color: transparent; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-size: 0.75rem; } -table.m-table td.m-default, table.m-table th.m-default, -table.m-table td.m-primary, table.m-table th.m-primary, -table.m-table td.m-success, table.m-table th.m-success, -table.m-table td.m-warning, table.m-table th.m-warning, -table.m-table td.m-danger, table.m-table th.m-danger, -table.m-table td.m-info, table.m-table th.m-info, -table.m-table td.m-dim, table.m-table th.m-dim { - padding-left: 0.4375rem; - padding-right: 0.4375rem; - border-left-width: 0.0625rem; +.m-imagegrid > div > figure > div::before, +.m-imagegrid > div > figure > figcaption::before, +.m-imagegrid > div > figure > a > div::before, +.m-imagegrid > div > figure > a > figcaption::before { + content: ''; + display: inline-block; + height: 100%; + vertical-align: bottom; + width: 0; } -table.m-table.m-big td.m-default, table.m-table.m-big th.m-default, -table.m-table.m-big td.m-primary, table.m-table.m-big th.m-primary, -table.m-table.m-big td.m-success, table.m-table.m-big th.m-success, -table.m-table.m-big td.m-warning, table.m-table.m-big th.m-warning, -table.m-table.m-big td.m-danger, table.m-table.m-big th.m-danger, -table.m-table.m-big td.m-info, table.m-table.m-big th.m-info, -table.m-table.m-big td.m-dim, table.m-table.m-big th.m-dim { - padding-left: 0.9375rem; - padding-right: 0.9375rem; - border-left-width: 0.0625rem; +.m-imagegrid > div > figure:hover > figcaption, +.m-imagegrid > div > figure:hover > a > figcaption { + background: linear-gradient(transparent 0%, transparent 75%, rgba(0, 0, 0, 0.85) 100%); + color: #ffffff; } -table.m-table tr.m-default td, table.m-table td.m-default, -table.m-table tr.m-default th, table.m-table th.m-default, -table.m-table tr.m-primary td, table.m-table td.m-primary, -table.m-table tr.m-primary th, table.m-table th.m-primary, -table.m-table tr.m-success td, table.m-table td.m-success, -table.m-table tr.m-success th, table.m-table th.m-success, -table.m-table tr.m-warning td, table.m-table td.m-warning, -table.m-table tr.m-warning th, table.m-table th.m-warning, -table.m-table tr.m-danger td, table.m-table td.m-danger, -table.m-table tr.m-danger th, table.m-table th.m-danger, -table.m-table tr.m-info td, table.m-table td.m-info, -table.m-table tr.m-info th, table.m-table th.m-info, -table.m-table tr.m-dim td, table.m-table td.m-dim, -table.m-table tr.m-dim th, table.m-table th.m-dim { - border-color: #ffffff; +.m-imagegrid > div > figure > img, +.m-imagegrid > div > figure > a > img { + width: 100%; + height: 100%; } -.m-block.m-default { border-left-color: #f7e3db; } -.m-block.m-default h3, .m-block.m-default h4, .m-block.m-default h5, .m-block.m-default h6 { - color: #000000; +.m-imagegrid > div::after { + display: block; + content: ' '; + clear: both; } -.m-block.m-primary { border-left-color: #cb4b16; } -.m-block.m-primary h3, .m-block.m-primary h4, .m-block.m-primary h5, .m-block.m-primary h6 { - color: #cb4b16; +@media screen and (max-width: 767px) { + .m-imagegrid > div > figure { + float: none; + width: 100% !important; + } + .m-imagegrid > div > figure > div, + .m-imagegrid > div > figure > figcaption, + .m-imagegrid > div > figure > a > div, + .m-imagegrid > div > figure > a > figcaption { + border-left-width: 0; + border-right-width: 0; + } } -.m-block.m-success { border-left-color: #31c25d; } -.m-block.m-success h3, .m-block.m-success h4, .m-block.m-success h5, .m-block.m-success h6 { - color: #31c25d; +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-note, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-frame, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-block, +.m-container-inflatable > .m-row > [class*='m-col-'] > .m-imagegrid, +.m-container-inflatable > .m-row > [class*='m-col-'] > pre, +.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-code-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-console-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-note, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-frame, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-block, +.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-imagegrid, +.m-container-inflatable > .m-row > [class*='m-col-'] section > pre, +.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-code-figure, +.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-console-figure { + margin-left: -1rem; + margin-right: -1rem; } -.m-block.m-warning { border-left-color: #c7cf2f; } -.m-block.m-warning h3, .m-block.m-warning h4, .m-block.m-warning h5, .m-block.m-warning h6 { - color: #c7cf2f; +@media screen and (min-width: 576px) { + .m-container-inflatable > .m-row > .m-col-s-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-s-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-danger { border-left-color: #f60000; } -.m-block.m-danger h3, .m-block.m-danger h4, .m-block.m-danger h5, .m-block.m-danger h6 { - color: #f60000; +@media screen and (min-width: 768px) { + .m-container-inflatable > .m-row > .m-col-m-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-m-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-info { border-left-color: #2e7dc5; } -.m-block.m-info h3, .m-block.m-info h4, .m-block.m-info h5, .m-block.m-info h6 { - color: #2e7dc5; +@media screen and (min-width: 992px) { + .m-container-inflatable > .m-row > .m-col-l-10 > .m-imagegrid.m-container-inflate, + .m-container-inflatable > .m-row > .m-col-l-10 section > .m-imagegrid.m-container-inflate { + margin-left: -10%; + margin-right: -10%; + } } -.m-block.m-dim { - border-left-color: #bdbdbd; - color: #bdbdbd; +pre.m-code span.hll { + margin-left: -1.0rem; + margin-right: -1.0rem; + padding-left: 1.0rem; } -.m-block.m-dim a { color: #c0c0c0; } -.m-block.m-dim a:hover, .m-block.m-dim a:focus, .m-block.m-dim a:active { - color: #949494; +pre.m-code.m-inverted { + color: rgba(91, 91, 91, 0.33); } -.m-block.m-flat { border-color: transparent; } -.m-block.m-flat h3, .m-block.m-flat h4, .m-block.m-flat h5. .m-block.m-flat h6 { - color: #000000; +pre.m-code.m-inverted > span { + opacity: 0.3333; } -.m-note.m-default { background-color: #fbf0ec; } -.m-note.m-default, -table.m-table tr.m-default td, table.m-table td.m-default, -table.m-table tr.m-default th, table.m-table th.m-default { +pre.m-code.m-inverted > span.hll { color: #000000; + opacity: 1; + background-color: transparent; + border-color: transparent; } -.m-note.m-default a:hover, -table.m-table tr.m-default td a:hover, table.m-table td.m-default a:hover, -table.m-table tr.m-default th a:hover, table.m-table th.m-default a:hover, -.m-note.m-default a:focus, -table.m-table tr.m-default td a:focus, table.m-table td.m-default a:focus, -table.m-table tr.m-default th a:focus, table.m-table th.m-default a:focus, -.m-note.m-default a:active, -table.m-table tr.m-default td a:active, table.m-table td.m-default a:active, -table.m-table tr.m-default th a:active, table.m-table th.m-default a:active { - color: #cb4b16; +div.m-math { + overflow-x: auto; + overflow-y: hidden; + text-align: center; } -.m-note.m-primary a, -table.m-table tr.m-primary td a, table.m-table td.m-primary a, -table.m-table tr.m-primary th a, table.m-table th.m-primary a { - color: #ea7944; +div.m-plot svg { + text-align: center; } -.m-note.m-primary, -table.m-table tr.m-primary td, table.m-table td.m-primary, -table.m-table tr.m-primary th, table.m-table th.m-primary { - background-color: #ef9069; - color: #fbe4d9; +div.m-plot .m-background { + fill: #fbf0ec; } -.m-note.m-primary a, -table.m-table tr.m-primary td a, table.m-table td.m-primary a, -table.m-table tr.m-primary th a, table.m-table th.m-primary a { - color: #782f0d; +div.m-plot svg .m-label { font-size: 11px; } +div.m-plot svg .m-title { font-size: 13px; } +div.m-plot svg .m-label, div.m-plot svg .m-title { fill: #000000; } +div.m-plot svg .m-line { + stroke: #000000; + stroke-width: 0.8; } -.m-note.m-primary a:hover, -table.m-table tr.m-primary td a:hover, table.m-table td.m-primary a:hover, -table.m-table tr.m-primary th a:hover, table.m-table th.m-primary a:hover, -.m-note.m-primary a:focus, -table.m-table tr.m-primary td a:focus, table.m-table td.m-primary a:focus, -table.m-table tr.m-primary th a:focus, table.m-table th.m-primary a:focus, -.m-note.m-primary a:active, -table.m-table tr.m-primary td a:active, table.m-table td.m-primary a:active, -table.m-table tr.m-primary th a:active, table.m-table th.m-primary a:active { - color: #2f1205; +div.m-plot svg .m-error { + stroke: #000000; + stroke-width: 1.5; } -.m-note.m-success, -table.m-table tr.m-success td, table.m-table td.m-success, -table.m-table tr.m-success th, table.m-table th.m-success { - background-color: #4dd376; - color: #f4fcf6; +div.m-plot svg .m-label.m-dim { fill: #bdbdbd; } +div.m-math svg, svg.m-math { fill: #000000; } +div.m-math.m-default svg, svg.m-math.m-default, div.m-plot svg .m-bar.m-default { + fill: #000000; } -.m-note.m-success a, -table.m-table tr.m-success td a, table.m-table td.m-success a, -table.m-table tr.m-success th a, table.m-table th.m-success a { - color: #c5f2d1; +div.m-math.m-primary svg, svg.m-math.m-primary, div.m-plot svg .m-bar.m-primary { + fill: #cb4b16; } -.m-note.m-success a:hover, -table.m-table tr.m-success td a:hover, table.m-table td.m-success a:hover, -table.m-table tr.m-success th a:hover, table.m-table th.m-success a:hover, -.m-note.m-success a:focus, -table.m-table tr.m-success td a:focus, table.m-table td.m-success a:focus, -table.m-table tr.m-success th a:focus, table.m-table th.m-success a:focus, -.m-note.m-success a:active, -table.m-table tr.m-success td a:active, table.m-table td.m-success a:active, -table.m-table tr.m-success th a:active, table.m-table th.m-success a:active { - color: #dcf6e3; +div.m-math.m-success svg, svg.m-math.m-success, div.m-plot svg .m-bar.m-success { + fill: #31c25d; } -.m-note.m-warning, table.m-table tr.m-warning td, table.m-table td.m-warning, - table.m-table tr.m-warning th, table.m-table th.m-warning { - background-color: #d1d34d; - color: #fcfcf4; +div.m-math.m-warning svg, svg.m-math.m-warning, div.m-plot svg .m-bar.m-warning { + fill: #c7cf2f; } -.m-note.m-warning a, table.m-table tr.m-warning td a, table.m-table td.m-warning a, - table.m-table tr.m-warning th a, table.m-table th.m-warning a { - color: #f0f1c7; +div.m-math.m-danger svg, svg.m-math.m-danger, div.m-plot svg .m-bar.m-danger { + fill: #f60000; } -.m-note.m-warning a:hover, -table.m-table tr.m-warning td a:hover, table.m-table td.m-warning a:hover, -table.m-table tr.m-warning th a:hover, table.m-table th.m-warning a:hover, -.m-note.m-warning a:focus, -table.m-table tr.m-warning td a:focus, table.m-table td.m-warning a:focus, -table.m-table tr.m-warning th a:focus, table.m-table th.m-warning a:focus, -.m-note.m-warning a:active, -table.m-table tr.m-warning td a:active, table.m-table td.m-warning a:active, -table.m-table tr.m-warning th a:active, table.m-table th.m-warning a:active { - color: #f6f6dc; +div.m-math.m-info svg, svg.m-math.m-info, div.m-plot svg .m-bar.m-info { + fill: #2e7dc5; } -.m-note.m-danger, -table.m-table tr.m-danger td, table.m-table td.m-danger, -table.m-table tr.m-danger th, table.m-table th.m-danger { - background-color: #e23e3e; - color: #fdf3f3; +div.m-math.m-dim svg, svg.m-math.m-dim, div.m-plot svg .m-bar.m-dim { + fill: #bdbdbd; } -.m-note.m-danger a, -table.m-table tr.m-danger td a, table.m-table td.m-danger a, -table.m-table tr.m-danger th a, table.m-table th.m-danger a { - color: #f2c7c6; +p, ul, ol, dl, blockquote, pre, figure.m-code-figure, figure.m-console-figure, +hr, .m-note, .m-frame, .m-block, div.m-button, div.m-scroll, table.m-table, +div.m-image, img.m-image, svg.m-image, figure.m-figure, .m-imagegrid, div.m-math { + margin-bottom: 1rem; } -.m-note.m-danger a:hover, -table.m-table tr.m-danger td a:hover, table.m-table td.m-danger a:hover, -table.m-table tr.m-danger th a:hover, table.m-table th.m-danger a:hover, -.m-note.m-danger a:focus, -table.m-table tr.m-danger td a:focus, table.m-table td.m-danger a:focus, -table.m-table tr.m-danger th a:focus, table.m-table th.m-danger a:focus, -.m-note.m-danger a:active, -table.m-table tr.m-danger td a:active, table.m-table td.m-danger a:active, -table.m-table tr.m-danger th a:active, table.m-table th.m-danger a:active { - color: #f6dddc; +p:last-child, ul:last-child, ol:last-child, dl:last-child, blockquote:last-child, +pre:last-child, figure.m-code-figure:last-child, figure.m-console-figure:last-child, +hr:last-child, .m-note:last-child, .m-frame:last-child, .m-block:last-child, +div.m-button:last-child, div.m-scroll:last-child, table.m-table:last-child, +img.m-image:last-child, svg.m-image:last-child, div.m-image:last-child, +figure.m-figure:last-child, .m-imagegrid:last-child, div.m-math:last-child { + margin-bottom: 0; } -.m-note.m-info, -table.m-table tr.m-info td, table.m-table td.m-info, -table.m-table tr.m-info th, table.m-table th.m-info { - background-color: #4c93d3; - color: #f4f8fc; +li > p:last-child, li > blockquote:last-child, li > pre:last-child, +li > figure.m-code-figure:last-child, li > figure.m-console-figure:last-child, +li > .m-note:last-child, li > .m-frame:last-child, li > .m-block:last-child, +li > div.m-button:last-child, li > div.m-scroll:last-child, li > table.m-table:last-child, +li > img.m-image:last-child, li > svg.m-image:last-child, li > div.m-image:last-child, +li > figure.m-figure:last-child, li > div.m-math:last-child { + margin-bottom: 1rem; } -.m-note.m-info a, -table.m-table tr.m-info td a, table.m-table td.m-info a, -table.m-table tr.m-info th a, table.m-table th.m-info a { - color: #c6ddf2; +li:last-child > p:last-child, li:last-child > blockquote:last-child, li:last-child > pre:last-child, +li:last-child > figure.m-code-figure:last-child, li:last-child > figure.m-console-figure:last-child, +li:last-child > .m-note:last-child, li:last-child > .m-frame:last-child, li:last-child > .m-block:last-child, +li:last-child > div.m-button:last-child, li:last-child > div.m-scroll:last-child, +li:last-child > table.m-table:last-child, li:last-child > img.m-image:last-child, +li:last-child > svg.m-image:last-child, li:last-child > div.m-image:last-child, +li:last-child > figure.m-figure:last-child, li:last-child > div.m-math:last-child { + margin-bottom: 0; } -.m-note.m-info a:hover, -table.m-table tr.m-info td a:hover, table.m-table td.m-info a:hover, -table.m-table tr.m-info th a:hover, table.m-table th.m-info a:hover, -.m-note.m-info a:focus, -table.m-table tr.m-info td a:focus, table.m-table td.m-info a:focus, -table.m-table tr.m-info th a:focus, table.m-table th.m-info a:focus, -.m-note.m-info a:active, -table.m-table tr.m-info td a:active, table.m-table td.m-info a:active, -table.m-table tr.m-info th a:active, table.m-table th.m-info a:active { - color: #dbeaf7; + +body > header > nav { + width: 100%; + background-color: #ffffff; + min-height: 3rem; } -.m-note.m-dim, -table.m-table tr.m-dim td, table.m-table td.m-dim, -table.m-table tr.m-dim th, table.m-table th.m-dim { - background-color: #f1f1f1; - color: #7c7c7c; +body > header > nav.m-navbar-landing, +body > header > nav.m-navbar-cover { + background-color: transparent; + position: relative; } -.m-note.m-dim a, -table.m-table tr.m-dim td a, table.m-table td.m-dim a, -table.m-table tr.m-dim th a, table.m-table th.m-dim a { - color: #c0c0c0; +body > header > nav.m-navbar-landing { + opacity: 0.8; } -.m-note.m-dim a:hover, -table.m-table tr.m-dim td a:hover, table.m-table td.m-dim a:hover, -table.m-table tr.m-dim th a:hover, table.m-table th.m-dim a:hover, -.m-note.m-dim a:focus, -table.m-table tr.m-dim td a:focus, table.m-table td.m-dim a:focus, -table.m-table tr.m-dim th a:focus, table.m-table th.m-dim a:focus, -.m-note.m-dim a:active, -table.m-table tr.m-dim td a:active, table.m-table td.m-dim a:active, -table.m-table tr.m-dim th a:active, table.m-table th.m-dim a:active { - color: #949494; +body > header > nav.m-navbar-cover { + background-color: rgba(255, 255, 255, 0.25); + opacity: 1; } -.m-text.m-default, .m-label.m-flat.m-default { color: #000000; } -.m-text.m-primary, .m-label.m-flat.m-primary { color: #cb4b16; } -.m-text.m-success, .m-label.m-flat.m-success { color: #31c25d; } -.m-text.m-warning, .m-label.m-flat.m-warning { color: #c7cf2f; } -.m-text.m-danger, .m-label.m-flat.m-danger { color: #f60000; } -.m-text.m-info, .m-label.m-flat.m-info { color: #2e7dc5; } -.m-text.m-dim, .m-label.m-flat.m-dim { color: #bdbdbd; } -.m-text.m-dim a { color: #c0c0c0; } -.m-text.m-dim a:hover, .m-text.m-dim a:focus, .m-text.m-dim a:active { - color: #949494; +body > header > nav.m-navbar-landing:hover, +body > header > nav.m-navbar-cover:hover { + background-color: rgba(255, 255, 255, 0.75); + opacity: 1; } -div.m-button a, .m-label { color: #ffffff; } -div.m-button.m-flat a { color: #000000; } -div.m-button.m-flat a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { +body> header > nav.m-navbar-landing:target, +body> header > nav.m-navbar-cover:target { + background-color: #ffffff; + opacity: 1; +} +body > header > nav.m-navbar-landing a#m-navbar-brand.m-navbar-brand-hidden { + visibility: hidden; +} +body > header > nav.m-navbar-landing:target a#m-navbar-brand.m-navbar-brand-hidden { + visibility: visible; +} +body > header > nav { + margin-left: auto; + margin-right: auto; + color: #000000; +} +body > header > nav a { + text-decoration: none; + text-transform: lowercase; + display: inline-block; + vertical-align: middle; + line-height: 2.75rem; + color: #000000; +} +body > header > nav a#m-navbar-brand, body > header > nav a#m-navbar-show, body > header > nav a#m-navbar-hide { + text-transform: lowercase; + font-weight: normal; + font-size: 1.125rem; + padding-left: 1rem; + padding-right: 1rem; +} +body > header > nav a#m-navbar-brand .m-thin { + font-weight: normal; +} +body > header > nav a#m-navbar-show:before, body > header > nav a#m-navbar-hide:before { + content:'\2630'; +} +body > header > nav #m-navbar-collapse { + padding-bottom: 1rem; +} +body > header > nav #m-navbar-collapse li { + border-style: solid; + border-color: transparent; + border-width: 0 0 0 0.25rem; + margin-left: -1rem; +} +body > header > nav #m-navbar-collapse li a { + border-style: solid; + border-color: transparent; + line-height: 1.5rem; + margin-left: -0.25rem; + padding-left: 0.75rem; + border-width: 0 0 0 0.25rem; + width: 100%; +} +body > header > nav #m-navbar-collapse li a#m-navbar-current { + color: #ea7944; + border-color: #ea7944; +} +body > header > nav ol { + list-style-type: none; + margin: 0; +} +body > header > nav ol ol { + padding-left: 1.5rem; +} +body > header > nav [class*='m-col-'] { + padding-top: 0; + padding-bottom: 0; +} +body > header > nav a:hover, body > header > nav a:focus, body > header > nav a:active { color: #cb4b16; } -div.m-button.m-default a, .m-label:not(.m-flat).m-default { background-color: #000000; } -div.m-button.m-primary a, .m-label:not(.m-flat).m-primary { background-color: #cb4b16; } -div.m-button.m-success a, .m-label:not(.m-flat).m-success { background-color: #31c25d; } -div.m-button.m-warning a, .m-label:not(.m-flat).m-warning { background-color: #c7cf2f; } -div.m-button.m-danger a, .m-label:not(.m-flat).m-danger { background-color: #f60000; } -div.m-button.m-info a, .m-label:not(.m-flat).m-info { background-color: #2e7dc5; } -div.m-button.m-dim a, .m-label:not(.m-flat).m-dim { background-color: #bdbdbd; } -div.m-button.m-default a:hover, div.m-button.m-default a:focus, div.m-button.m-default a:active { - background-color: #cb4b16; +body > header > nav #m-navbar-collapse li:hover { + border-color: #cb4b16; } -div.m-button.m-primary a:hover, div.m-button.m-primary a:focus, div.m-button.m-primary a:active { - background-color: #000000; +body > header > nav #m-navbar-collapse li a:hover, +body > header > nav #m-navbar-collapse li a:focus, +body > header > nav #m-navbar-collapse li a:active { + border-color: #cb4b16; + background-color: rgba(255, 255, 255, 0.5); +} +body > header > nav.m-navbar-landing #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:hover, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:focus, +body > header > nav.m-navbar-landing #m-navbar-collapse li a:active, +body > header > nav.m-navbar-cover #m-navbar-collapse li a:active { + background-color: var(--header-link-active-background-color-semi); +} +body > header > nav #m-navbar-hide { + display: none; +} +body > header > nav:target #m-navbar-collapse { + display: block; +} +body > header > nav:target #m-navbar-show { + display: none; +} +body > header > nav:target #m-navbar-hide { + display: inline-block; +} +@media screen and (min-width: 768px) { + body > header > nav #m-navbar-show, body > header > nav #m-navbar-hide, + body > header > nav:target #m-navbar-show, body > header > nav:target #m-navbar-hide { + display: none; + } + body > header > nav #m-navbar-collapse li a { + line-height: 2.75rem; + } + body > header > nav a, body > header > nav #m-navbar-collapse li a { + margin-left: 0; + padding-left: 1rem; + padding-right: 1rem; + white-space: nowrap; + } + body > header > nav #m-navbar-collapse { + padding-bottom: 0; + } + body > header > nav #m-navbar-collapse li ol { + background-color: #ffffff; + } + body > header > nav #m-navbar-collapse ol ol li { + margin-left: 0; + padding-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse ol ol li a { + padding-left: 0.75rem; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li { + margin-left: 0; + border-left-width: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol > li > a { + border-width: 0.25rem 0 0 0; + } + body > header > nav #m-navbar-collapse ol { + padding-left: 0; + padding-right: 0; + } + body > header > nav #m-navbar-collapse > .m-row > ol, body > header > nav #m-navbar-collapse > .m-row > ol > li { + float: left; + } + body > header > nav #m-navbar-collapse ol ol { + z-index: 99999; + position: absolute; + visibility: hidden; + } + body > header > nav #m-navbar-collapse li:hover ol { + visibility: visible; + } } -div.m-button.m-success a:hover, div.m-button.m-success a:focus, div.m-button.m-success a:active { - background-color: #dcf6e3; +body > footer { + width: 100%; } -div.m-button.m-warning a:hover, div.m-button.m-warning a:focus, div.m-button.m-warning a:active { - background-color: #f6f6dc; +body > footer > nav { + padding-top: 1rem; + padding-bottom: 1rem; + font-size: 0.85rem; + text-align: center; + color: #7c7c7c; + background-color: #eeeeee; } -div.m-button.m-danger a:hover, div.m-button.m-danger a:focus, div.m-button.m-danger a:active { - background-color: #f6dddc; +body > footer > nav h3, body > footer > nav h3 a { + text-transform: uppercase; + font-weight: normal; } -div.m-button.m-info a:hover, div.m-button.m-info a:focus, div.m-button.m-info a:active { - background-color: #c6ddf2; +body > footer > nav ul { + list-style-type: none; + padding: 0; + margin: 0; } -div.m-button.m-dim a:hover, div.m-button.m-dim a:focus, div.m-button.m-dim a:active { - background-color: #c0c0c0; +body > footer > nav a { + text-decoration: none; + text-transform: lowercase; + color: #191919; } -img.m-image, svg.m-image { - display: block; - margin-left: auto; - margin-right: auto; +body > footer > nav a:hover, body > footer > nav a:focus, body > footer > nav a:active { + color: #494949; } -div.m-image { - text-align: center; +body > main { + padding-top: 1rem; + padding-bottom: 1rem; } -img.m-image, svg.m-image, div.m-image img { - max-width: 100%; - border-radius: 0.2rem; +article h1 { + font-size: 1.75rem; } -div.m-image.m-fullwidth img, div.m-image.m-fullwidth svg { - width: 100%; +article h1 .m-breadcrumb { + color: #bdbdbd; + font-weight: normal; } -figure.m-figure { - max-width: 100%; - margin-top: 0; - margin-left: auto; - margin-right: auto; - position: relative; - display: table; +article h1 .m-breadcrumb a { + color: #cb4b16; } -figure.m-figure:before { - position: absolute; - content: ' '; - top: 0; - bottom: 0; - left: 0; - right: 0; - z-index: -1; - border-style: solid; - border-width: 0.125rem; - border-radius: 0.2rem; - border-color: #f7e3db; +article h1 .m-breadcrumb a:hover, article h1 a:focus, article h1 a:active { + color: #802f0e; } -figure.m-figure.m-flat:before { - border-color: transparent; +article > header h1 { + font-size: 2rem; + margin-bottom: 0.5rem; } -figure.m-figure > * { - margin-left: 1rem; - margin-right: 1rem; - display: table-caption; - caption-side: bottom; +article h1 a, article > header h1, article > header h1 a, +article section > h2, article section > h2 a, +article section > h3, article section > h3 a, +article section > h4, article section > h4 a, +article section > h5, article section > h5 a, +article section > h6, article section > h6 a { + color: #cb4b16; } -figure.m-figure > *:first-child { - display: inline; +article h1 a:hover, article > header h1 a:hover, article > header h1 a:focus, article > header h1 a:active, +article section > h2 a:hover, article section > h2 a:focus, article section > h2 a:active, +article section > h3 a:hover, article section > h3 a:focus, article section > h3 a:active, +article section > h4 a:hover, article section > h4 a:focus, article section > h4 a:active, +article section > h5 a:hover, article section > h5 a:focus, article section > h5 a:active, +article section > h6 a:hover, article section > h6 a:focus, article section > h6 a:active { + color: #802f0e; } -figure.m-figure > *:last-child { - margin-bottom: 1rem; +article > header .m-date { + display: block; + width: 2.5rem; + float: left; + text-align: center; + line-height: 95%; + font-size: 0.75rem; + font-weight: normal; + white-space: nowrap; + border-right-style: solid; + border-right-width: 0.125rem; + border-color: #cb4b16; + padding-right: 0.75rem; + margin-top: -0.1rem; + margin-right: 0.75rem; + margin-bottom: 0.25rem; } -figure.m-figure img { - position: relative; - margin-left: 0; - margin-right: 0; - margin-bottom: 0; - border-top-left-radius: 0.2rem; - border-top-right-radius: 0.2rem; - max-width: 100%; +article > header .m-date-day { + display: block; + font-weight: bold; + padding-top: 0.2rem; + padding-bottom: 0.15rem; + font-size: 1.25rem; } -figure.m-figure.m-flat img { - border-bottom-left-radius: 0.2rem; - border-bottom-right-radius: 0.2rem; +article > header p { + color: #7a7a7a; + font-size: 1.125rem; } -figure.m-figure figcaption { - margin-top: 0.5rem; - margin-bottom: 0.5rem; - font-weight: normal; - font-size: 1.17rem; +article > header h1::after { + content: " "; + clear: both; + display: table; } -figure.m-figure a img { - margin-left: -1rem; - margin-right: -1rem; +article > footer { + color: #969696; } -figure.m-figure.m-fullwidth, figure.m-figure.m-fullwidth > * { - display: block; +article > footer p { + font-style: italic; + font-size: 0.85rem; + text-indent: 0; } -figure.m-figure.m-fullwidth > *:first-child { - display: inline; +article section:target { + margin-left: -1.0rem; + border-left-style: solid; + border-left-width: 0.25rem; + padding-left: 0.75rem; + border-color: #cb4b16; } -figure.m-figure.m-fullwidth img { - width: 100%; +article h1 a, article > header h1 a, article section > h2 a, article section > h3 a, +article section > h4 a, article section > h5 a, article section > h6 a { + text-decoration: none; } -figure.m-figure.m-fullwidth:after { - content: ' '; - display: block; - margin-top: 1rem; - height: 1px; +#m-landing-image, #m-cover-image, article#m-jumbo > header #m-jumbo-image { + background-size: cover; + background-color: #666666; + background-position: center center; + background-repeat: no-repeat; + margin-top: -4rem; + padding-top: 5rem; } -figure.m-code-figure, figure.m-console-figure { - margin-top: 0; - margin-left: 0; - margin-right: 0; - position: relative; - padding: 1rem; +#m-landing-image { + color: #ffffff; } -figure.m-code-figure:before, figure.m-console-figure:before { - position: absolute; - content: ' '; - top: 0; - bottom: 0; - left: 0; - right: 0; - z-index: -1; - border-style: solid; - border-width: 0.125rem; - border-radius: 0.2rem; +#m-cover-image { + height: 30rem; + margin-bottom: -26rem; } -figure.m-code-figure:before { - border-color: #fbf0ec; +#m-landing-cover h1 { + font-size: 2.8rem; + margin-top: -0.5rem; + padding-left: 1.5rem; + padding-bottom: 1rem; + text-transform: lowercase; } -figure.m-console-figure:before { - border-color: #000000; +#m-landing-cover { + padding-bottom: 10rem; + margin-bottom: -6rem; } -figure.m-code-figure.m-flat:before, figure.m-console-figure.m-flat:before { - border-color: transparent; +article#m-jumbo { + margin-top: -1rem; } -figure.m-code-figure > pre:first-child, figure.m-console-figure > pre:first-child { - position: relative; - margin: -1rem -1rem 1rem -1rem; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; +#m-landing-cover, #m-cover-image > div, article#m-jumbo > header #m-jumbo-cover { + background: linear-gradient(transparent 0%, transparent 50%, #ffffff 100%); + width: 100%; + height: 100%; } -article section:target figure.m-code-figure, article section:target figure.m-console-figure { - z-index: 1; +article#m-jumbo > header h1, article#m-jumbo > header h2 { + text-align: center; + font-weight: bold; } -figure.m-figure.m-default:before { border-color: #fbf0ec; } -figure.m-figure.m-default figcaption { color: #000000; } -figure.m-figure.m-primary:before { border-color: #ef9069; } -figure.m-figure.m-primary figcaption { color: #cb4b16; } -figure.m-figure.m-success:before { border-color: #4dd376; } -figure.m-figure.m-success figcaption { color: #31c25d; } -figure.m-figure.m-warning:before { border-color: #d1d34d; } -figure.m-figure.m-warning figcaption { color: #c7cf2f; } -figure.m-figure.m-danger:before { border-color: #e23e3e; } -figure.m-figure.m-danger figcaption { color: #f60000; } -figure.m-figure.m-info:before { border-color: #4c93d3; } -figure.m-figure.m-info figcaption { color: #2e7dc5; } -figure.m-figure.m-dim:before { border-color: #f1f1f1; } -figure.m-figure.m-dim { color: #bdbdbd; } -figure.m-figure.m-dim a { color: #c0c0c0; } -figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m-dim a:active { - color: #949494; +article#m-jumbo > header a { + text-decoration: none; } -.m-imagegrid > div { - background-color: #ffffff; /* to avoid section HL shining through */ +article#m-jumbo > header #m-jumbo-cover { + padding-bottom: 5rem; } -.m-imagegrid > div > figure { - display: block; - float: left; - position: relative; - margin: 0; +article#m-jumbo > header #m-jumbo-image { + font-size: 2.5vmin; + margin-bottom: -3rem; } -.m-imagegrid > div > figure > div, -.m-imagegrid > div > figure > figcaption, -.m-imagegrid > div > figure > a > div, -.m-imagegrid > div > figure > a > figcaption { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - border-color: #ffffff; - border-style: solid; - border-width: 0.25rem; - padding: 0.5rem; +article#m-jumbo > header h1 { + font-size: 10vmin; } -.m-imagegrid > div > figure:first-child > div, -.m-imagegrid > div > figure:first-child > figcaption, -.m-imagegrid > div > figure:first-child > a > div, -.m-imagegrid > div > figure:first-child > a > figcaption { - border-left-width: 0; +article#m-jumbo > header h2 { + font-size: 3vmin; } -.m-imagegrid > div > figure:last-child > div, -.m-imagegrid > div > figure:last-child > figcaption, -.m-imagegrid > div > figure:last-child > a > div, -.m-imagegrid > div > figure:last-child > a > figcaption { - border-right-width: 0; +@media screen and (max-height: 640px) , screen and (max-width: 640px) { + article#m-jumbo > header h1 { + font-size: 3rem; + } + article#m-jumbo > header #m-jumbo-image, article#m-jumbo > header h2 { + font-size: 1rem; + } } -.m-imagegrid > div > figure > figcaption, -.m-imagegrid > div > figure > a > figcaption { - color: transparent; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - font-size: 0.75rem; +article#m-jumbo > header, article#m-jumbo > header h1, article#m-jumbo > header a { + color: #ffffff; } -.m-imagegrid > div > figure > div::before, -.m-imagegrid > div > figure > figcaption::before, -.m-imagegrid > div > figure > a > div::before, -.m-imagegrid > div > figure > a > figcaption::before { - content: ''; +article#m-jumbo > header a:hover, article#m-jumbo > header a:focus, article#m-jumbo > header a:active { + color: #f0f0f0; +} +article#m-jumbo.m-inverted > header, article#m-jumbo.m-inverted > header h1, article#m-jumbo.m-inverted > header a { + color: #000000; +} +article#m-jumbo.m-inverted > header a:hover, article#m-jumbo.m-inverted > header a:focus, article#m-jumbo.m-inverted > header a:active { + color: #0f0f0f; +} +.m-landing-news h3 a { + color: #000000; + text-decoration: none; + text-transform: uppercase; +} +.m-landing-news h3 a:hover, .m-landing-news h3 a:hover, .m-landing-news h3 a:focus, .m-landing-news h3 a:active { + color: #cb4b16; +} +.m-landing-news time { display: inline-block; - height: 100%; - vertical-align: bottom; - width: 0; + margin-left: 1rem; + float: right; } -.m-imagegrid > div > figure:hover > figcaption, -.m-imagegrid > div > figure:hover > a > figcaption { - background: linear-gradient(transparent 0%, transparent 75%, rgba(0, 0, 0, 0.85) 100%); - color: #ffffff; +.m-article-pagination { + text-align: center; + padding: 1rem; } -.m-imagegrid > div > figure > img, -.m-imagegrid > div > figure > a > img { - width: 100%; - height: 100%; +nav.m-navpanel { + text-align: center; } -.m-imagegrid > div::after { - display: block; - content: ' '; - clear: both; +nav.m-navpanel h3 { + text-transform: uppercase; + font-weight: normal; } -@media screen and (max-width: 767px) { - .m-imagegrid > div > figure { - float: none; - width: 100% !important; - } - .m-imagegrid > div > figure > div, - .m-imagegrid > div > figure > figcaption, - .m-imagegrid > div > figure > a > div, - .m-imagegrid > div > figure > a > figcaption { - border-left-width: 0; - border-right-width: 0; - } +nav.m-navpanel ol { + text-transform: lowercase; } -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-note, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-frame, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-block, -.m-container-inflatable > .m-row > [class*='m-col-'] > .m-imagegrid, -.m-container-inflatable > .m-row > [class*='m-col-'] > pre, -.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-code-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] > figure.m-console-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-note, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-frame, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-block, -.m-container-inflatable > .m-row > [class*='m-col-'] section > .m-imagegrid, -.m-container-inflatable > .m-row > [class*='m-col-'] section > pre, -.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-code-figure, -.m-container-inflatable > .m-row > [class*='m-col-'] section > figure.m-console-figure { - margin-left: -1rem; - margin-right: -1rem; +nav.m-navpanel ol, nav.m-navpanel ul { + list-style-type: none; + padding: 0; } -@media screen and (min-width: 576px) { - .m-container-inflatable > .m-row > .m-col-s-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-s-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +nav.m-navpanel a { + color: #292929; + text-decoration: none; } -@media screen and (min-width: 768px) { - .m-container-inflatable > .m-row > .m-col-m-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-m-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +nav.m-navpanel a:hover, nav.m-navpanel a:focus, nav.m-navpanel a:active { + color: #cb4b16; } -@media screen and (min-width: 992px) { - .m-container-inflatable > .m-row > .m-col-l-10 > .m-imagegrid.m-container-inflate, - .m-container-inflatable > .m-row > .m-col-l-10 section > .m-imagegrid.m-container-inflate { - margin-left: -10%; - margin-right: -10%; - } +ul.m-tagcloud li { display: inline; } +ul.m-tagcloud li.m-tag-1 { font-size: 0.75rem; } +ul.m-tagcloud li.m-tag-2 { font-size: 0.825rem; } +ul.m-tagcloud li.m-tag-3 { font-size: 1rem; } +ul.m-tagcloud li.m-tag-4 { font-size: 1.25rem; } +ul.m-tagcloud li.m-tag-5 { font-size: 1.5rem; } +article section:target figure.m-code-figure, article section:target figure.m-console-figure { + z-index: 1; } +article, article > header, article section { margin-bottom: 1rem; } +article:last-child, article section:last-child { margin-bottom: 0; } .m-container-inflatable section:target > .m-note, .m-container-inflatable section:target > .m-frame, .m-container-inflatable section:target > .m-block, @@ -1720,101 +1815,6 @@ figure.m-figure.m-dim a:hover, figure.m-figure.m-dim a:focus, figure.m-figure.m- .m-container-inflatable section:target section > .m-note.m-dim { border-left-color: #bdbdbd; } -pre.m-code span.hll { - margin-left: -1.0rem; - margin-right: -1.0rem; - padding-left: 1.0rem; -} -pre.m-code.m-inverted { - color: rgba(91, 91, 91, 0.33); -} -pre.m-code.m-inverted > span { - opacity: 0.3333; -} -pre.m-code.m-inverted > span.hll { - color: #000000; - opacity: 1; - background-color: transparent; - border-color: transparent; -} -div.m-math { - overflow-x: auto; - overflow-y: hidden; - text-align: center; -} -div.m-plot svg { - text-align: center; -} -div.m-plot .m-background { - fill: #fbf0ec; -} -div.m-plot svg .m-label { font-size: 11px; } -div.m-plot svg .m-title { font-size: 13px; } -div.m-plot svg .m-label, div.m-plot svg .m-title { fill: #000000; } -div.m-plot svg .m-line { - stroke: #000000; - stroke-width: 0.8; -} -div.m-plot svg .m-error { - stroke: #000000; - stroke-width: 1.5; -} -div.m-plot svg .m-label.m-dim { fill: #bdbdbd; } -div.m-math svg, svg.m-math { fill: #000000; } -div.m-math.m-default svg, svg.m-math.m-default, div.m-plot svg .m-bar.m-default { - fill: #000000; -} -div.m-math.m-primary svg, svg.m-math.m-primary, div.m-plot svg .m-bar.m-primary { - fill: #cb4b16; -} -div.m-math.m-success svg, svg.m-math.m-success, div.m-plot svg .m-bar.m-success { - fill: #31c25d; -} -div.m-math.m-warning svg, svg.m-math.m-warning, div.m-plot svg .m-bar.m-warning { - fill: #c7cf2f; -} -div.m-math.m-danger svg, svg.m-math.m-danger, div.m-plot svg .m-bar.m-danger { - fill: #f60000; -} -div.m-math.m-info svg, svg.m-math.m-info, div.m-plot svg .m-bar.m-info { - fill: #2e7dc5; -} -div.m-math.m-dim svg, svg.m-math.m-dim, div.m-plot svg .m-bar.m-dim { - fill: #bdbdbd; -} -p, ul, ol, dl, blockquote, pre, figure.m-code-figure, figure.m-console-figure, -hr, article, article > header, article section, -.m-note, .m-frame, .m-block, div.m-button, -div.m-scroll, table.m-table, div.m-image, img.m-image, svg.m-image, -figure.m-figure, .m-imagegrid, div.m-math { - margin-bottom: 1rem; -} -p:last-child, ul:last-child, ol:last-child, dl:last-child, blockquote:last-child, -pre:last-child, figure.m-code-figure:last-child, figure.m-console-figure:last-child, -hr:last-child, article:last-child, article section:last-child, -.m-note:last-child, .m-frame:last-child, .m-block:last-child, -div.m-button:last-child, div.m-scroll:last-child, table.m-table:last-child, -img.m-image:last-child, svg.m-image:last-child, div.m-image:last-child, -figure.m-figure:last-child, .m-imagegrid:last-child, div.m-math:last-child { - margin-bottom: 0; -} -li > p:last-child, li > blockquote:last-child, li > pre:last-child, -li > figure.m-code-figure:last-child, li > figure.m-console-figure:last-child, -li > .m-note:last-child, li > .m-frame:last-child, li > .m-block:last-child, -li > div.m-button:last-child, li > div.m-scroll:last-child, li > table.m-table:last-child, -li > img.m-image:last-child, li > svg.m-image:last-child, li > div.m-image:last-child, -li > figure.m-figure:last-child, li > div.m-math:last-child { - margin-bottom: 1rem; -} -li:last-child > p:last-child, li:last-child > blockquote:last-child, li:last-child > pre:last-child, -li:last-child > figure.m-code-figure:last-child, li:last-child > figure.m-console-figure:last-child, -li:last-child > .m-note:last-child, li:last-child > .m-frame:last-child, li:last-child > .m-block:last-child, -li:last-child > div.m-button:last-child, li:last-child > div.m-scroll:last-child, -li:last-child > table.m-table:last-child, li:last-child > img.m-image:last-child, -li:last-child > svg.m-image:last-child, li:last-child > div.m-image:last-child, -li:last-child > figure.m-figure:last-child, li:last-child > div.m-math:last-child { - margin-bottom: 0; -} .m-console .hll { background-color: #ffffcc } .m-console .g-AnsiBlack { color: #000000 } diff --git a/css/m-light.css b/css/m-light.css index 57908116..395b27f5 100644 --- a/css/m-light.css +++ b/css/m-light.css @@ -22,133 +22,11 @@ DEALINGS IN THE SOFTWARE. */ +@import url('m-theme-light.css'); @import url('m-grid.css'); @import url('m-components.css'); +@import url('m-layout.css'); /* TODO: pygments-light.css */ @import url('pygments-console.css'); -:root { - /* Text properties */ - --font: 'Libre Baskerville', serif; - --code-font: 'Source Code Pro', monospace; - --font-size: 14px; - --paragraph-indent: 1.5rem; - --paragraph-align: justify; - --link-decoration: underline; - --link-decoration-nav: none; - --link-decoration-heading: none; - --nav-brand-case: lowercase; - --nav-menu-case: lowercase; - --nav-heading-case: uppercase; - --nav-categories-case: lowercase; - --landing-header-case: lowercase; - --heading-font-weight: normal; - - /* Shapes */ - --border-radius: 0.2rem; - - /* Basics */ - --background-color: #ffffff; - --color: #000000; - --line-color: #f7e3db; - --link-color: #ea7944; - --link-active-color: #cb4b16; - --mark-color: #4c93d3; - --mark-background-color: #e6e69c; - --code-color: #5b5b5b; - --code-inverted-color: rgba(91, 91, 91, 0.33); - --code-background-color: #fbf0ec; - --code-note-background-color: rgba(251, 240, 236, 0.5); - --console-background-color: #000000; - --button-background-color: #ffffff; - - /* Header */ - --header-border-width: 0.25rem 0 0 0; - --header-color: #000000; - --header-background-color: #ffffff; - --header-background-color-landing: rgba(255, 255, 255, 0.75); - --header-background-color-jumbo: rgba(255, 255, 255, 0.25); - --header-link-color: #000000; - --header-link-active-color: #cb4b16; - --header-link-current-color: #ea7944; - --header-link-active-background-color: #ffffff; - --header-link-active-background-color: rgba(255, 255, 255, 0.5); - - /* Footer */ - --footer-font-size: 0.85rem; - --footer-color: #7c7c7c; - --footer-background-color: #eeeeee; - --footer-link-color: #191919; - --footer-link-active-color: #494949; - - /* Cover image */ - --cover-image-background-color: #666666; - - /* Article */ - --article-header-color: #7a7a7a; - --article-footer-color: #969696; - --article-heading-color: #cb4b16; - --article-heading-active-color: #802f0e; - - /* Right navigation panel */ - --navpanel-link-color: #292929; - --navpanel-link-active-color: #cb4b16; - - /* Plots */ - --plot-background-color: #fbf0ec; - --plot-error-color: #000000; - - /* Colored components */ - --default-color: #000000; - --default-filled-color: #000000; - --default-filled-background-color: #fbf0ec; - --default-filled-link-color: #ea7944; - --default-filled-link-active-color: #cb4b16; - --default-button-active-color: #cb4b16; - - --primary-color: #cb4b16; - --primary-filled-color: #fbe4d9; - --primary-filled-background-color: #ef9069; - --primary-filled-link-color: #782f0d; - --primary-filled-link-active-color: #2f1205; - --primary-button-active-color: #000000; - - --success-color: #31c25d; - --success-filled-color: #f4fcf6; - --success-filled-background-color: #4dd376; - --success-filled-link-color: #c5f2d1; - --success-filled-link-active-color: #dcf6e3; - --success-button-active-color: #dcf6e3; - - --warning-color: #c7cf2f; - --warning-filled-color: #fcfcf4; - --warning-filled-background-color: #d1d34d; - --warning-filled-link-color: #f0f1c7; - --warning-filled-link-active-color: #f6f6dc; - --warning-button-active-color: #f6f6dc; - - --danger-color: #f60000; - --danger-filled-color: #fdf3f3; - --danger-filled-background-color: #e23e3e; - --danger-filled-link-color: #f2c7c6; - --danger-filled-link-active-color: #f6dddc; - --danger-button-active-color: #f6dddc; - - --info-color: #2e7dc5; - --info-filled-color: #f4f8fc; - --info-filled-background-color: #4c93d3; - --info-filled-link-color: #c6ddf2; - --info-filled-link-active-color: #dbeaf7; - --info-button-active-color: #c6ddf2; - - --dim-color: #bdbdbd; - --dim-link-color: #c0c0c0; - --dim-link-active-color: #949494; - --dim-filled-color: #7c7c7c; - --dim-filled-background-color: #f1f1f1; - --dim-filled-link-color: #c0c0c0; - --dim-filled-link-active-color: #949494; - --dim-button-active-color: #c0c0c0; -} - /* kate: indent-width 2; */ diff --git a/css/m-light.doxygen.compiled.css b/css/m-light.doxygen.compiled.css index 5b060ecd..27af5abb 100644 --- a/css/m-light.doxygen.compiled.css +++ b/css/m-light.doxygen.compiled.css @@ -1,4 +1,4 @@ -/* Generated using `./postprocess.py m-light.css m-doxygen.css --no-import -o m-light.doxygen.compiled.css`. Do not edit. */ +/* Generated using `./postprocess.py m-light.css m-theme-light.css m-doxygen.css --no-import -o m-light.doxygen.compiled.css`. Do not edit. */ /* This file is part of m.css. diff --git a/css/m-theme-dark.css b/css/m-theme-dark.css new file mode 100644 index 00000000..8f328d92 --- /dev/null +++ b/css/m-theme-dark.css @@ -0,0 +1,151 @@ +/* + This file is part of m.css. + + Copyright © 2017, 2018 Vladimír Vondruš + + Permission is hereby granted, free of charge, to any person obtaining a + copy of this software and associated documentation files (the "Software"), + to deal in the Software without restriction, including without limitation + the rights to use, copy, modify, merge, publish, distribute, sublicense, + and/or sell copies of the Software, and to permit persons to whom the + Software is furnished to do so, subject to the following conditions: + + The above copyright notice and this permission notice shall be included + in all copies or substantial portions of the Software. + + THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL + THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING + FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER + DEALINGS IN THE SOFTWARE. +*/ + +:root { + /* Text properties */ + --font: 'Source Sans Pro', sans-serif; + --code-font: 'Source Code Pro', monospace; + --font-size: 16px; + --paragraph-indent: 1.5rem; + --paragraph-align: justify; + --link-decoration: underline; + --link-decoration-nav: none; + --link-decoration-heading: none; + --nav-brand-case: uppercase; + --nav-menu-case: none; + --nav-heading-case: uppercase; + --nav-categories-case: lowercase; + --landing-header-case: lowercase; + --heading-font-weight: bold; + + /* Shapes */ + --border-radius: 0.2rem; + + /* Basics */ + --background-color: #2f363f; + --color: #dcdcdc; + --line-color: #405363; + --link-color: #5b9dd9; + --link-active-color: #a5c9ea; + --mark-color: #2f83cc; + --mark-background-color: #c7cf2f; + --code-color: #e6e6e6; + --code-inverted-color: rgba(230, 230, 230, 0.33); + /* This is simply color-picked --code-note-background-color on top of + --background-color */ + --code-background-color: #282e36; + --code-note-background-color: rgba(34, 39, 46, 0.5); + --console-background-color: #000000; + --button-background-color: #22272e; + + /* Header */ + --header-border-width: 0 0 0.25rem 0; + --header-color: #ffffff; + --header-background-color: #22272e; + --header-background-color-landing: rgba(34, 39, 46, 0.75); + --header-background-color-jumbo: rgba(34, 39, 46, 0.25); + --header-link-color: #ffffff; + --header-link-active-color: #a5c9ea; + --header-link-current-color: #5b9dd9; + --header-link-active-background-color: #292f37; + --header-link-active-background-color-semi: rgba(41, 47, 55, 0.5); + + /* Footer */ + --footer-font-size: 0.85rem; + --footer-color: #c5c5c5; + --footer-background-color: #444e5c; + --footer-link-color: #ffffff; + --footer-link-active-color: #a5c9ea; + + /* Cover image */ + --cover-image-background-color: #0f1217; + + /* Article */ + --article-header-color: #f0f0f0; + --article-footer-color: #c5c5c5; + --article-heading-color: #a5c9ea; + --article-heading-active-color: #dcdcdc; + + /* Right navigation panel */ + --navpanel-link-color: #ffffff; + --navpanel-link-active-color: #a5c9ea; + + /* Plots */ + --plot-background-color: #34424d; + --plot-error-color: #ffffff; + + /* Colored components */ + --default-color: #dcdcdc; + --default-filled-color: #dcdcdc; + --default-filled-background-color: #34424d; + --default-filled-link-color: #5b9dd9; + --default-filled-link-active-color: #a5c9ea; + --default-button-active-color: #a5c9ea; + + --primary-color: #a5c9ea; + --primary-filled-color: #2f363f; + --primary-filled-background-color: #a5c2db; + --primary-filled-link-color: #2a75b6; + --primary-filled-link-active-color: #2f363f; + --primary-button-active-color: #dcdcdc; + + --success-color: #3bd267; + --success-filled-color: #acecbe; + --success-filled-background-color: #2a703f; + --success-filled-link-color: #3bd267; + --success-filled-link-active-color: #acecbe; + --success-button-active-color: #acecbe; + + --warning-color: #c7cf2f; + --warning-filled-color: #e9ecae; + --warning-filled-background-color: #6d702a; + --warning-filled-link-color: #b8bf2b; + --warning-filled-link-active-color: #e9ecae; + --warning-button-active-color: #e9ecae; + + --danger-color: #cd3431; + --danger-filled-color: #ff9391; + --danger-filled-background-color: #702b2a; + --danger-filled-link-color: #d85c59; + --danger-filled-link-active-color: #ff9391; + --danger-button-active-color: #ff9391; + + --info-color: #2f83cc; + --info-filled-color: #a5caeb; + --info-filled-background-color: #2a4f70; + --info-filled-link-color: #5297d7; + --info-filled-link-active-color: #a5caeb; + --info-button-active-color: #5297d7; + + --dim-color: #747474; + --dim-link-color: #acacac; + --dim-link-active-color: #747474; + --dim-filled-color: #747474; + --dim-filled-background-color: #2d3236; + --dim-filled-link-color: #acacac; + --dim-filled-link-active-color: #747474; + --dim-button-active-color: #acacac; +} + +/* kate: indent-width 2; */ diff --git a/css/m-theme-light.css b/css/m-theme-light.css new file mode 100644 index 00000000..c6f13842 --- /dev/null +++ b/css/m-theme-light.css @@ -0,0 +1,149 @@ +/* + This file is part of m.css. + + Copyright © 2017, 2018 Vladimír Vondruš + + Permission is hereby granted, free of charge, to any person obtaining a + copy of this software and associated documentation files (the "Software"), + to deal in the Software without restriction, including without limitation + the rights to use, copy, modify, merge, publish, distribute, sublicense, + and/or sell copies of the Software, and to permit persons to whom the + Software is furnished to do so, subject to the following conditions: + + The above copyright notice and this permission notice shall be included + in all copies or substantial portions of the Software. + + THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL + THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING + FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER + DEALINGS IN THE SOFTWARE. +*/ + +:root { + /* Text properties */ + --font: 'Libre Baskerville', serif; + --code-font: 'Source Code Pro', monospace; + --font-size: 14px; + --paragraph-indent: 1.5rem; + --paragraph-align: justify; + --link-decoration: underline; + --link-decoration-nav: none; + --link-decoration-heading: none; + --nav-brand-case: lowercase; + --nav-menu-case: lowercase; + --nav-heading-case: uppercase; + --nav-categories-case: lowercase; + --landing-header-case: lowercase; + --heading-font-weight: normal; + + /* Shapes */ + --border-radius: 0.2rem; + + /* Basics */ + --background-color: #ffffff; + --color: #000000; + --line-color: #f7e3db; + --link-color: #ea7944; + --link-active-color: #cb4b16; + --mark-color: #4c93d3; + --mark-background-color: #e6e69c; + --code-color: #5b5b5b; + --code-inverted-color: rgba(91, 91, 91, 0.33); + --code-background-color: #fbf0ec; + --code-note-background-color: rgba(251, 240, 236, 0.5); + --console-background-color: #000000; + --button-background-color: #ffffff; + + /* Header */ + --header-border-width: 0.25rem 0 0 0; + --header-color: #000000; + --header-background-color: #ffffff; + --header-background-color-landing: rgba(255, 255, 255, 0.75); + --header-background-color-jumbo: rgba(255, 255, 255, 0.25); + --header-link-color: #000000; + --header-link-active-color: #cb4b16; + --header-link-current-color: #ea7944; + --header-link-active-background-color: #ffffff; + --header-link-active-background-color: rgba(255, 255, 255, 0.5); + + /* Footer */ + --footer-font-size: 0.85rem; + --footer-color: #7c7c7c; + --footer-background-color: #eeeeee; + --footer-link-color: #191919; + --footer-link-active-color: #494949; + + /* Cover image */ + --cover-image-background-color: #666666; + + /* Article */ + --article-header-color: #7a7a7a; + --article-footer-color: #969696; + --article-heading-color: #cb4b16; + --article-heading-active-color: #802f0e; + + /* Right navigation panel */ + --navpanel-link-color: #292929; + --navpanel-link-active-color: #cb4b16; + + /* Plots */ + --plot-background-color: #fbf0ec; + --plot-error-color: #000000; + + /* Colored components */ + --default-color: #000000; + --default-filled-color: #000000; + --default-filled-background-color: #fbf0ec; + --default-filled-link-color: #ea7944; + --default-filled-link-active-color: #cb4b16; + --default-button-active-color: #cb4b16; + + --primary-color: #cb4b16; + --primary-filled-color: #fbe4d9; + --primary-filled-background-color: #ef9069; + --primary-filled-link-color: #782f0d; + --primary-filled-link-active-color: #2f1205; + --primary-button-active-color: #000000; + + --success-color: #31c25d; + --success-filled-color: #f4fcf6; + --success-filled-background-color: #4dd376; + --success-filled-link-color: #c5f2d1; + --success-filled-link-active-color: #dcf6e3; + --success-button-active-color: #dcf6e3; + + --warning-color: #c7cf2f; + --warning-filled-color: #fcfcf4; + --warning-filled-background-color: #d1d34d; + --warning-filled-link-color: #f0f1c7; + --warning-filled-link-active-color: #f6f6dc; + --warning-button-active-color: #f6f6dc; + + --danger-color: #f60000; + --danger-filled-color: #fdf3f3; + --danger-filled-background-color: #e23e3e; + --danger-filled-link-color: #f2c7c6; + --danger-filled-link-active-color: #f6dddc; + --danger-button-active-color: #f6dddc; + + --info-color: #2e7dc5; + --info-filled-color: #f4f8fc; + --info-filled-background-color: #4c93d3; + --info-filled-link-color: #c6ddf2; + --info-filled-link-active-color: #dbeaf7; + --info-button-active-color: #c6ddf2; + + --dim-color: #bdbdbd; + --dim-link-color: #c0c0c0; + --dim-link-active-color: #949494; + --dim-filled-color: #7c7c7c; + --dim-filled-background-color: #f1f1f1; + --dim-filled-link-color: #c0c0c0; + --dim-filled-link-active-color: #949494; + --dim-button-active-color: #c0c0c0; +} + +/* kate: indent-width 2; */ diff --git a/css/postprocess.py b/css/postprocess.py index a0d58003..7ca4362d 100755 --- a/css/postprocess.py +++ b/css/postprocess.py @@ -154,8 +154,8 @@ def postprocess(files, process_imports, out_file): # Now open the imported files and parse them as well. Not doing any # recursive parsing. - for file in imported_files + files[1:]: - out.write('\n') + for i, file in enumerate(imported_files + files[1:]): + if i: out.write('\n') with open(file) as f: parse(f) diff --git a/css/postprocess.sh b/css/postprocess.sh index 8fc39474..91fedcc8 100755 --- a/css/postprocess.sh +++ b/css/postprocess.sh @@ -1,7 +1,7 @@ ./postprocess.py m-dark.css ./postprocess.py m-dark.css m-doxygen.css -o m-dark+doxygen.compiled.css -./postprocess.py m-dark.css m-doxygen.css --no-import -o m-dark.doxygen.compiled.css +./postprocess.py m-dark.css m-theme-dark.css m-doxygen.css --no-import -o m-dark.doxygen.compiled.css ./postprocess.py m-light.css ./postprocess.py m-light.css m-doxygen.css -o m-light+doxygen.compiled.css -./postprocess.py m-light.css m-doxygen.css --no-import -o m-light.doxygen.compiled.css +./postprocess.py m-light.css m-theme-light.css m-doxygen.css --no-import -o m-light.doxygen.compiled.css diff --git a/doc/css.rst b/doc/css.rst index 4bc28a22..76d7e521 100644 --- a/doc/css.rst +++ b/doc/css.rst @@ -40,17 +40,25 @@ applied to all elements by default. `Quick start`_ ============== -To make full advantage of m.css, you need just three files written in plain +To make full advantage of m.css, you need the following files written in plain CSS. Download them below or :gh:`grab the whole Git repository `: - :gh:`m-grid.css ` with optional - :gh:`m-debug.css ` -- :gh:`m-components.css ` + :gh:`m-debug.css ` for responsiveness +- :gh:`m-components.css ` for + typography and basic components +- :gh:`m-layout.css ` for overall page + and article layout +- :gh:`m-theme-dark.css ` or + :gh:`m-theme-light.css ` for + theme setup - :gh:`m-dark.css ` or - :gh:`m-light.css ` + :gh:`m-light.css ` that :css:`@import` + the above files for a convenient single-line referencing -In addition to the above, if you want to present highlighted code snippets (or -colored terminal output) on your website, there's also a builtin style for +Scroll below for a detailed functionality description of each file. In addition +to the above, if you want to present highlighted code snippets (or colored +terminal output) on your website, there's also a builtin style for `Pygments `_, matching m.css themes: - :gh:`pygments-dark.css `, @@ -58,11 +66,11 @@ colored terminal output) on your website, there's also a builtin style for - :gh:`pygments-console.css `, generated from :gh:`pygments-dark.py ` -Once you have the files, include them in your HTML markup. The top-level -``m-dark.css`` / ``m-light.css`` file includes the other via CSS :css:`@import` -statement, so you don't need to reference these. The dark theme uses the -`Source Sans Pro `_ font for -copy and `Source Code Pro `_ +Once you have the files, reference them from your HTML markup. The top-level +``m-dark.css`` / ``m-light.css`` file includes the others via a CSS +:css:`@import` statement, so you don't need to link all of them. The dark theme +uses the `Source Sans Pro `_ +font for copy and `Source Code Pro `_ font for pre-formatted text and code, which you need to reference as well. See the `Themes <{filename}/css/themes.rst>`_ page for requirements of other themes. @@ -140,14 +148,13 @@ image grid. `Page layout » <{filename}/css/page-layout.rst>`_ ================================================= -Besides that, ``m-components.css`` has also full-fledged collection of elements -to form not only the content, but the whole page including navigation --- -header and footer, section headings, article styling with sidebar and tag cloud -and more. +In ``m-layout.css`` there's a styling for the whole page including navigation +--- header and footer, section headings, article styling with sidebar, tag +cloud, active section highlighting and more. `Themes » <{filename}/css/themes.rst>`_ ======================================= -Finally, ``m-dark.css`` and ``m-light.css`` use CSS variables to achieve easy -theming. Two builtin themes, used by the author himself on a bunch of websites -to guarantee that everything fits well together. +Finally, ``m-theme-dark.css`` and ``m-theme-light.css`` use CSS variables to +achieve easy theming. Two builtin themes, used by the author himself on a bunch +of websites to guarantee that everything fits well together. diff --git a/doc/css/components.rst b/doc/css/components.rst index fc340fec..282d15c1 100644 --- a/doc/css/components.rst +++ b/doc/css/components.rst @@ -37,8 +37,8 @@ Components .. role:: html(code) :language: html -m.css provides a set of basic components for further improving the layout and -display of authored content. +In `m-components.css <{filename}/css.rst>`_, m.css provides a set of basic +components for further improving the layout and display of authored content. .. contents:: :class: m-block m-default diff --git a/doc/css/page-layout.rst b/doc/css/page-layout.rst index 96817041..b4d5905f 100644 --- a/doc/css/page-layout.rst +++ b/doc/css/page-layout.rst @@ -42,8 +42,9 @@ Page layout .. role:: sh(code) :language: sh -Besides separate components, m.css provides a fully-fledged whole page layout, -including top navigation bar, footer navigation, article styling and more. +With `m-layout.css <{filename}/css.rst>`_, m.css provides a full-fledged whole +page layout, including top navigation bar, footer navigation, article styling, +active section highlighting and more. .. note-success:: diff --git a/doc/css/themes.rst b/doc/css/themes.rst index 46121985..b3776d73 100644 --- a/doc/css/themes.rst +++ b/doc/css/themes.rst @@ -35,18 +35,20 @@ Themes .. role:: css(code) :language: css -m.css provides two themes, a dark and a light one. A theme consists of just a -set of CSS variables, which affect fonts, colors and other properties. The -theme file is also an self-contained entry point for the whole m.css framework ---- it includes all the other necessary CSS files except fonts via CSS -:css:`@import` statements. +The `m-theme-*.css <{filename}/css.rst>`_ files provide final theming for the +style. Currently, m.css provides two themes, a dark and a light one. A theme +file consists of just a set of CSS variables, which affect fonts, colors and +other properties. Together with theme file, m.css provides also a "driver file" +that includes all the other necessary CSS files except fonts via CSS +:css:`@import` statements --- so you can reference just ``m-dark.css`` instead +of four distinct files. .. block-warning:: Browser support Note that :abbr:`some browsers ` have problems with CSS variables and :css:`@import` statements. Because of that, the builtin themes provide a ``*.compiled.css`` version that contains a - preprocessed version without CSS variables or :css:`import` statements; + preprocessed version without CSS variables or :css:`@import` statements; which also make it smaller in total. This compiled version includes also the Pygments code highlighting style, all combined in one file. @@ -59,7 +61,7 @@ theme file is also an self-contained entry point for the whole m.css framework `Dark`_ ======= -The dark theme is described in the `m-dark.css <{filename}/css.rst>`_ (or +The dark theme is contained in the `m-dark.css <{filename}/css.rst>`_ (or ``m-dark.compiled.css``) file. Besides that, you need to reference also `Source Sans Pro `_ font (used for page copy) and `Source Code Pro `_ @@ -78,11 +80,11 @@ This theme is used on this site and also on http://magnum.graphics. `Light`_ ======== -The light theme is described in the `m-light.css <{filename}/css.rst>`_ file. -Besides that, you need to reference also +The light theme is contained in the `m-light.css <{filename}/css.rst>`_ (or +``m-light.compiled.css``) file. Besides that, you need to reference also `Libre Baskerville `_ font (used for page copy) and `Source Code Pro `_ -(used for pre-formatted text and code). You can get them on Google Fonts. +(used for pre-formatted text and code). .. code:: html @@ -96,13 +98,13 @@ If you want to see this theme live, go to http://blog.mosra.cz. ================ Making your own theme is usually just a matter of modifying CSS variables in -the top-level file. To give an example, a portion of the ``m-dark.css`` file +the theme file. To give an example, a portion of the ``m-theme-dark.css`` file looks like this: -.. include:: ../../../css/m-dark.css +.. include:: ../../../css/m-theme-dark.css :code: css - :start-line: 29 - :end-line: 53 + :start-line: 24 + :end-line: 48 The project also bundles a Python script for *post*\ processing the CSS files into a single ``*.compiled.css`` file without :css:`@import` statements or diff --git a/doc/css/typography.rst b/doc/css/typography.rst index 6b847db5..93d577c7 100644 --- a/doc/css/typography.rst +++ b/doc/css/typography.rst @@ -38,8 +38,8 @@ Typography :language: html Right after being responsive, typography is the second most important thing in -m.css and so the most often used HTML elements are styled to make them look -great by default. +m.css. The `m-components.css <{filename}/css.rst>`_ file styles the most often +used HTML elements to make them look great by default. .. contents:: :class: m-block m-default diff --git a/pelican-theme/static/m-layout.css b/pelican-theme/static/m-layout.css new file mode 120000 index 00000000..c9cb6119 --- /dev/null +++ b/pelican-theme/static/m-layout.css @@ -0,0 +1 @@ +../../css/m-layout.css \ No newline at end of file diff --git a/pelican-theme/static/m-theme-dark.css b/pelican-theme/static/m-theme-dark.css new file mode 120000 index 00000000..b9305563 --- /dev/null +++ b/pelican-theme/static/m-theme-dark.css @@ -0,0 +1 @@ +../../css/m-theme-dark.css \ No newline at end of file diff --git a/pelican-theme/static/m-theme-light.css b/pelican-theme/static/m-theme-light.css new file mode 120000 index 00000000..abafe7e9 --- /dev/null +++ b/pelican-theme/static/m-theme-light.css @@ -0,0 +1 @@ +../../css/m-theme-light.css \ No newline at end of file -- 2.30.2