anchor.diff:          top: 0.75rem;
         }
         .ColorTitle {
  +        font-style: inherit;
           font-weight: 600;
  -        text-align: center;
  +        font-family: inherit;
           font-size: 1.25rem;
           line-height: 1.2;
         }
  
positive.code:         //- p.
          //-   Then there&rsquo;s the added bonus of its name being based off of the Moon, which is an
          //-   integral part of #[cite Portal] gameplay.
          section
            h3 #[cite Solarized] Color Scheme
            dl.o-FlexContainer
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:0 a-bc-s03").h-darkbg Solarized Base03
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:1 a-bc-s03").h-darkbg
                ul
                  li dark code background
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:0 a-bc-s3") Solarized Base3
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:1 a-bc-s3")
                ul
                  li light code background
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:1 a-bc-s02").h-darkbg Solarized Base02
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:2 a-bc-s02").h-darkbg
                ul
                  li dark code border
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:1 a-bc-s2") Solarized Base2
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:2 a-bc-s2")
                ul
                  li light code border
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:2 a-bc-s01") Solarized Base01
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:3 a-bc-s01")
                ul
                  li light code emphasis
                  li dark code comment
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:2 a-bc-s1") Solarized Base1
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:3 a-bc-s1")
                ul
                  li light code comment
                  li dark code emphasis
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:3 a-bc-s00") Solarized Base00
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:4 a-bc-s00")
                ul
                  li light code text
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:3 a-bc-s0") Solarized Base0
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:4 a-bc-s0")
                ul
                  li dark code text
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:4 a-bc-sr") Solarized Red
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:5 a-bc-sr")
                ul
                  li programming control (#[code if], #[code for], #[code switch], #[code return])
                  li other control (#[code public], #[code private], #[code static])
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:4 a-bc-sc") Solarized Cyan
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:5 a-bc-sc")
                ul
                  li HTML attribute values
                  li CSS property values
                  li strings (except in CSS#[sup: a.Rf#rf-cssstring(rel="this" href="#fn-cssstring") 2])
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:5 a-bc-so") Solarized Orange
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:6 a-bc-so")
                ul
                  li delimiters and operators (#[code +], #[code ==], #[code .], #[code new], #[code typeof])
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:5 a-bc-sb") Solarized Blue
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:6 a-bc-sb")
                ul
                  li HTML tags
                  li CSS/Less class selectors
                  li JS function definitions and function calls
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:6 a-bc-sy") Solarized Yellow
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:7 a-bc-sy")
                ul
                  li HTML attribute names
                  li CSS property names
                  li pre-defined keywords and types (#[code var], #[code function], #[code int], #[code class])
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:6 a-bc-sv") Solarized Violet
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:7 a-bc-sv")
                ul
                  li variable names
                  li function arguments
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:7 a-bc-sg") Solarized Green
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:8 a-bc-sg")
                ul
                  li HTML characters and entities
                  li CSS numeric values with units
                  li constant values (numbers, colors, booleans, #[code null])
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:7 a-bc-sm") Solarized Magenta
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:8 a-bc-sm")
                ul
                  li string delimiters (#[code &quot;] and #[code &apos;])
                  li #[sup: a.Fn#fn-cssstring(rel="this" href="#rf-cssstring") 2]CSS strings
                  li object/class/function references (custom, built-in, #[code this], #[code prototype], #[code String], #[code Array])
          section
            h3 #[i Lunarized] Color Scheme
            dl.o-FlexContainer
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:0 a-bc-l03").h-darkbg Lunarized Base03
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:1 a-bc-l03").h-darkbg
                p.ColorRelation inverse of Solarized Base 03
                ul
                  li dark code background
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:0 a-bc-l3") Lunarized Base3
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:1 a-bc-l3")
                p.ColorRelation inverse of Solarized Base 3
                ul
                  li light code background
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:1 a-bc-l02").h-darkbg Lunarized Base02
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:2 a-bc-l02").h-darkbg
                p.ColorRelation inverse of Solarized Base 02
                ul
                  li dark code border
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:1 a-bc-l2") Lunarized Base2
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:2 a-bc-l2")
                p.ColorRelation inverse of Solarized Base 2
                ul
                  li light code border
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:2 a-bc-l01") Lunarized Base01
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:3 a-bc-l01")
                p.ColorRelation inverse of Solarized Base 01
                ul
                  li light code emphasis
                  li dark code comment
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:2 a-bc-l1") Lunarized Base1
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:3 a-bc-l1")
                p.ColorRelation inverse of Solarized Base 1
                ul
                  li light code comment
                  li dark code emphasis
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:3 a-bc-l00") Lunarized Base00
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:4 a-bc-l00")
                p.ColorRelation inverse of Solarized Base 00
                ul
                  li light code text
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:3 a-bc-l0") Lunarized Base0
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:4 a-bc-l0")
                p.ColorRelation inverse of Solarized Base 0
                ul
                  li dark code text
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:4 a-bc-lc") Lunarized Cyan
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:5 a-bc-lc"): p.ColorRelation complement of Solarized Red
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:4 a-bc-lr") Lunarized Red
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:5 a-bc-lr"): p.ColorRelation complement of Solarized Cyan
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:5 a-bc-lb") Lunarized Blue
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:6 a-bc-lb"): p.ColorRelation complement of Solarized Orange
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:5 a-bc-lo") Lunarized Orange
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:6 a-bc-lo"): p.ColorRelation complement of Solarized Blue
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:6 a-bc-li") Lunarized Indigo
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:7 a-bc-li"): p.ColorRelation complement of Solarized Yellow
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:6 a-bc-ly") Lunarized Yellow
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:7 a-bc-ly"): p.ColorRelation complement of Solarized Violet
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:7 a-bc-lv") Lunarized Violet
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:8 a-bc-lv"): p.ColorRelation complement of Solarized Green
              dt.o-Box.ColorTitle(class="!w:1o2 !xo:7 a-bc-lg") Lunarized Green
              dd.o-Box.ColorDescr(class="!w:1o2 !xo:8 a-bc-lg"): p.ColorRelation complement of Solarized Magenta
          section
            h3 Interactive Example
            form.o-FlexContainer
  
negative.code:         footer.
            This color scheme is based on the
            #[a(rel="external" href="http://www.thinkwithportals.com/"): cite Portal] video game series.
          section.o-FlexContainer
            h3(class="!w:1o1") Main Portal Colors
            section.o-Box(class="!w:1o2").u-bgc_aperture_white
              h4.ColorTitle Aperture White
              p: span.ColorCode #f2f7ff
              p.
                The purity of Aperture Science in all its glory. This dazzling
                brilliance of bluish light seen on the portalable panels coated with
                Conversion Gel makes the background emit an eerie glow, like the full moon.
              ul
                li body background
            section.o-Box(class="!w:1o2").u-bgc_aperture_black.h-darkbg
              h4.ColorTitle Aperture Black
              p: span.ColorCode #0d0800
              p.
                The polar opposite of Aperture White. Representing the true dark nature
                of the Enrichment Center, this is the color of the panels that inhibit
                portals. A hint of orange is infinitesimally noticeable. What better way to
                complement the background color than the color of normal text?
              ul
                li body text
            section.o-Box(class="!w:1o2").u-bgc_lakesuperior.h-darkbg
              h4.ColorTitle Lake Superior
              p: span.ColorCode #120099
              p.
                This Great Lake borders #[a Ontonagon, MI], the location of the
                Aperture Science Enrichment Center. A perfect fit for superior headings on
                a page.
              ul
                li major heading text
                li ledes and drop caps
            section.o-Box(class="!w:1o2").u-bgc_facilityabyss.h-darkbg
              h4.ColorTitle Facility Abyss
              p: span.ColorCode #3d6166
              p.
                This color can be seen in the endless depths of the subterranean
                Enrichment Center. This color is for #[i minor] headings of a page.
              ul
                li minor heading text
            section.o-Box(class="!w:1o2").u-bgc_atlas.h-darkbg
              h4.ColorTitle Atlas
              p: span.ColorCode #0062ff
              p.
                Short and stout, Atlas is one of the two robots used for testing.
                Untouched hyperlinks are dedicated to his digital iris.
              ul
                li link text
            section.o-Box(class="!w:1o2").u-bgc_pbody
              h4.ColorTitle P-Body
              p: span.ColorCode #ff9d00
              p.
                Tall and wiry, P-body is one of the two robots used for testing.
                Hovered hyperlinks are dedicated to his (or her?) digital iris.
              ul
                li hover link text
          section.o-FlexContainer
            h3(class="!w:1o1") UI Component Colors
            section.o-Box(class="!w:1o2").u-bgc_deploying.h-darkbg
              h4.ColorTitle Deploying
              p: span.ColorCode #ff4b33
              p.
                The one word you never want to hear without a portal gun. Just as the
                iris of a Sentry Turret, this color is briefly seen, providing a subtle accent
                on the site.
              ul
                li Danger components
            section.o-Box(class="!w:1o2").u-bgc_hereye
              h4.ColorTitle HER Eye
              p: span.ColorCode #ffe433
              p.
                This color alone will scare the
                prokaryotic-microorganism-infested-fecal-matter out of you. See where you can
                find it. You monster.
              ul
                li Caution components
            section.o-Box(class="!w:1o2").u-bgc_neurotoxin
              h4.ColorTitle Neurotoxin
              p: span.ColorCode #9acc7a
              p.
                Long ago an #[i accident] resulted in the unleashing of
                this deadly vapor and the murdering of the entire human staff of
                Aperture Laboratories. Some say it could happen again, but this time on the
                test subjects&hellip;
              ul
                li Success components
            section.o-Box(class="!w:1o2").u-bgc_bridges
              h4.ColorTitle Bridges of Light
              p: span.ColorCode #99daff
              p.
                Hard Light Bridges are literally massless, yet they can sustain
                infinite weight, as Chell can attest to.
              ul
                li Info components
            section.o-Box(class="!w:1o2").u-bgc_companion
              h4.ColorTitle Heart of a Companion
              p: span.ColorCode #ff99c0
              p.
                Believed to be sentient by some and alive by others, the
                Weighted Companion Cube has been said to provide advice and display emotions
                such as brevity, care, and love. It is even believed to hum opera when near
                a friend. A perfect color for helpful elements on a Web page.
              ul
                li Help components
            section.o-Box(class="!w:1o2").u-bgc_vilify.h-darkbg
              h4.ColorTitle Vilify
              p: span.ColorCode #9d00ff
              p: q(class="!fs:t" cite="https://www.youtube.com/watch?v=G-Vg2YS-sFE").
                You&rsquo;ve
                got sucker&rsquo;s luck. Have you given up? Does it feel
                like a trial? Does it trouble your mind the way you trouble mine?
          section.o-FlexContainer
            h3(class="!w:1o1") More Portal Colors
            section.o-Box(class="!w:1o2").u-bgc_cavescaves.h-darkbg
              h4.ColorTitle Cave&rsquo;s Caves
              p: span.ColorCode #80522b
              p.
                Cave&rsquo;s underground salt mines were the ideal venue for early
                test chambers.
            section.o-Box(class="!w:1o2").u-bgc_asbestos
              h4.ColorTitle Asbestos
              p: span.ColorCode #bf9300
              p.
                The forgotten underground test chambers are ridden with this harmful
                substance. Or so Mr.&nbsp;Johnson says.
            section.o-Box(class="!w:1o2").u-bgc_repulsion
              h4.ColorTitle Repulsion Gel
              p: span.ColorCode #33b4ff
              p.
                Good news, you&rsquo;re not part of the control group; you get the gel.
                Bad news, it does #[em not] like the human skeleton. Turns out you might
                just break every bone in your legs anyway.
              ul
                li code/kbd/samp on print
            section.o-Box(class="!w:1o2").u-bgc_propulsion
              h4.ColorTitle Propulsion Gel
              p: span.ColorCode #ff7e33
              p #[i Forwarding] the cause of science.
              ul
                li subheading text
          section
            h3 Gray Tones and Shadows
            aside.o-Box.o-Box--dialog(style="margin-bottom: 1.5rem; border: 1px solid #9acc7a; background: rgba(0, 0, 0, 0.05); box-shadow: inset 0 0 0.5rem 0rem rgba(0,0,0,0.2);")
  