/* ******************************************************************************* */
/* > Table of Contents                                                             */
/* ******************************************************************************* */

/* > FONT CONFIGURATION                                                            */
/* > COLOR CONFIGURATION                                                           */
/* > FONTS FOR HTML ELEMENTS (defaults, headlines, running text, machinery         */
/* >> Default fonts                                                                */
/* >> Headlines and titles                                                         */
/* >> Containers                                                                   */
/* >> Running text                                                                 */
/* >> Footnotes and sidenotes                                                      */
/* >> Rubrics                                                                      */
/* >> TOC                                                                          */
/* >> Branding                                                                     */
/* >> Site machinery (by region)                                                   */
/* >>> Regions                                                                     */
/* >>> Sidebars                                                                    */
/* >>> Menus and tabs                                                              */
/* >>> Links (bottom of the post)                                                  */
/* >>> Messages                                                                    */
/* >>> Footer                                                                      */
/* >>> Affordances                                                                 */
/* >>> Footer affordances                                                          */
/* > ZEROPOINT RESPONSIVE GEOMETRY                                                 */
/* > USER LOGIN, USER PAGES                                                        */
/* > FRONT PAGE                                                                    */
/* > SEARCH PAGE                                                                   */
/* >> Search form                                                                  */
/* >> Facet Filter Blocks                                                          */
/* >> Help                                                                         */
/* >> Summary                                                                      */
/* >> Search Hits                                                                  */
/* > LINK COLORS                                                                   */
/* > TWEETS                                                                        */
/* > POSTS                                                                         */
/* > COMMENTS                                                                      */
/* > RSS LOGO, the horror                                                          */
/* > BLOGROLL, the horror                                                          */
/* > PULLED QUOTE                                                                  */
/* > TABLES                                                                        */
/* > SHUTTING DOWN SIDEBARS FOR LARGE TABLE DISPLAYS                               */
/* > FAQ MODULE                                                                    */
/* > TERMS                                                                         */
/* > PINNED POST                                                                   */
/* > VIEWS                                                                         */
/* > IMAGE POSITION for ALL CONTENT                                                */
/* > SLIDESHOW                                                                     */
/* > BORDER FOR NON-THEMED BLOCKS                                                  */
/* > SIDEBARS' BLOCKS ADAPTIVE DISPLAY                                             */

/* ******************************************************************************* */
/* > FONT CONFIGURATION                                                            */
/* ******************************************************************************* */

/* Turns out I want condensed for tables:

Cabin-Bold.ttf
Cabin-BoldItalic.ttf
Cabin-Italic.ttf
Cabin-Medium.ttf
Cabin-MediumItalic.ttf
Cabin-Regular.ttf
Cabin-SemiBold.ttf
Cabin-SemiBoldItalic.ttf

Cabin_Condensed-Bold.ttf
Cabin_Condensed-BoldItalic.ttf
Cabin_Condensed-Italic.ttf
Cabin_Condensed-Regular.ttf

Cabin_SemiCondensed-Bold.ttf
Cabin_SemiCondensed-BoldItalic.ttf
Cabin_SemiCondensed-Italic.ttf
Cabin_SemiCondensed-Regular.ttf

CrimsonPro-Black.ttf
CrimsonPro-BlackItalic.ttf
CrimsonPro-Bold.ttf
CrimsonPro-BoldItalic.ttf
CrimsonPro-ExtraBold.ttf
CrimsonPro-ExtraBoldItalic.ttff
CrimsonPro-ExtraLight.ttf
CrimsonPro-ExtraLightItalic.ttf
CrimsonPro-Italic.ttf
CrimsonPro-Light.ttf
CrimsonPro-LightItalic.ttf
CrimsonPro-Medium.ttf
CrimsonPro-MediumItalic.ttf
CrimsonPro-Regular.ttf
CrimsonPro-SemiBold.ttf
CrimsonPro-SemiBoldItalic.ttf

Inconsolata-Light.ttf
Inconsolata-Medium.ttf

*/

/* body text is Crimson Pro (serif) */
@font-face {
  font-family: "Crimson Pro";
  src: url('fonts/CrimsonPro-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Crimson Pro";
  src: url('fonts/CrimsonPro-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: bold;
}

/* just realized there's no CSS keyword for bold italic */
@font-face {
  font-family: "Crimson Pro";
  src: url('fonts/CrimsonPro-Italic.ttf') format('truetype');
  font-style: italic;
  font-weight: normal;
}

@font-face {
  font-family: "Crimson Pro";
  src: url('fonts/CrimsonPro-Italic.ttf') format('truetype');
  font-style: italic;
}

/* Headlines and machinery sans-serif */
@font-face {
  font-family: "Cabin";
  src: url('fonts/Cabin-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Cabin";
  src: url('fonts/Cabin-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Cabin";
  src: url('fonts/Cabin-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: "Cabin";
  src: url('fonts/Cabin-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
}

/* Condensed for Tables */
/* Changed from the subtler semi-condensed */

@font-face {
  font-family: "Cabin Condensed", sans-serif;
  src: url('fonts/Cabin_Condensed-Regular.ttf') format('truetype');
  font-weight: normal; 
}

@font-face {
  font-family: "Cabin Condensed", sans-serif;;
  src: url('fonts/Cabin_Condensed-Bold.ttf') format('truetype');
  font-weight: bold; 
}
    
@font-face {
  font-family: "Cabin Condensed", sans-serif;;
  src: url('fonts/Cabin_Condensed-Italic.ttf') format('truetype');
  font-weight: normal; 
  font-style: italic;
}

@font-face {
  font-family: "Cabin Condensed", sans-serif;;
  src: url('Cabin_Condensed-BoldItalic.ttf') format('truetype');
  font-weight: bold; 
  font-style: italic;
}
    
    
/* Heck, why not monospace */

/* light for text */
@font-face {
  font-family: "Inconsolata";
  src: url('fonts/Inconsolata-Medium.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* medium for for code blocks */
@font-face {
  font-family: "Inconsolata";
  src: url('fonts/Inconsolata-Medium.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* And dingbats! */
@font-face {
  font-family: "Noto Sans Symbols 2";
  src: url('fonts/NotoSansSymbols2-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* And Font Awesome, all to get a question mark in a circle */
/* From: 

    https://www.w3schools.com/icons/tryit.asp?filename=tryicons_fa-question-circle
*/

@font-face {
  font-family: 'FontAwesome';
  src: url('fonts/fontawesome-webfont.eot?v=4.7.0');
  src: url('fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

/* There are many many .fa* classes, but this one will do */
.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fa-question-circle:before {
  content: "\f059";
}

.fa-question-circle-o:before {
  content: "\f29c";
}

/* I need Martel for a sample in an About post */

@font-face {
  font-family: "Martel";
  src: url('fonts/Martel-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* fighting to get this style to "take" */
.martel p {
  font-family: "Martel";
  font-size: .85em;
  font-weight: normal;
  font-style: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* https://shkspr.mobi/blog/2025/09/targetting-specific-characters-with-css-rules/ */
/* https://www.w3schools.com/cssref/atrule_font-face.php */
/* U+61 U+0061 U+2022 */
/* Already "Black" so font-weight though available does nothing */
/* https://developer.chrome.com/blog/font-fallbacks */
/* ascent-override seems not to "take" */

@font-face {
    font-family: "Bullet";
    unicode-range: U+2022;
    src: url('fonts/arial_black.ttf') format('truetype');
    size-adjust: 175%;
}


/* ******************************************************************************* */
/* > COLOR CONFIGURATION                                                           */
/* ******************************************************************************* */

/*  Obviously this should be systematized */
/*  Must deal with opinionated contributed modules, however */
/*

HEX        NAME            Used for

#333333    Dark Charcoal*  Text
#36454F    Charcoal        Text (from ZeroPoint fs* classes)

#C70039    Rebel Red       Rubrics

#CCCCCC    Cerebral Grey*  Vertical rules (blockquote)
#F5F5F5    White Smoke     Vertical rules (blockquote)
#DCDCDC    Gainsboro       Shadows

#1C1EFE    Electric Blue   Links (internal)
#28B463    Lime Green      Links (terms)
#C0C0C0    Silver          Links (sidebar)

#2E6F40    Forest Green    Affordance (action, e.g. "Search")
#FFC000    Amber           Affordance (caution, e.g. "Reset")
#FFFFFF    White*          Affordance (button background)

Affordances like MacOS, green, yellow, red. Except more saturated.

#FFE135    Banana Yellow   Highlight in search snippet hits

NAMED COLORS FOR TESTING ONLY, SHOULD HAVE BEEN REMOVED

* Web safe:

  Web safety not a concern (but if I really want a truly retro look?)

        https://colorhexpro.com/web-safe-colors-what-they-are-and-why-they-still-matter/

        "The 216 web safe colors are created using combinations of these six hex 
        values:
        
        00, 33, 66, 99, CC, FF."

*/

.rubric {
    color: #C70039;
}

/* ******************************************************************************* */
/* > FONTS FOR HTML ELEMENTS (defaults, headlines, running text, machinery         */
/* ******************************************************************************* */

/* https://beautifulwebtype.com/crimson-pro/glyphs/?i=5 

   Sadly, ligatures in Crimson Pro are borked, so no:
   
       font-feature-settings: 'liga', 'clig', 'dlig';
       font-feature-settings: "c2sc", "smcp";

*/

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Default fonts                                                                */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

html {
    font-family: 'Crimson Pro', serif;
    color: #333333;
    font-weight: normal;
}

.fs0 {
  font-size: 1.3em;
  color: #36454F;
}

.fs1 {
  font-size: 1.3em;
  color: #36454F;
}

.fs2 {
  font-size: 2.1em;
  color: #36454F;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Headlines and titles                                                         */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* out of the box, pretty produced an enormous orphan so I reverted to balance */
h1, h2, h3, h4, h5, h6, .block-title, .viewsreference--view-title {
    font-family: 'Cabin', sans-serif;
    font-weight: bold;
    margin-block-end: 0 !important;
    font-optical-sizing: auto;
    font-variant-ligatures: none;
    text-wrap: balance;
}

/* Likely to  be multiline, hence more leading */
h1 {
	font-size: 2.2em;
    line-height: 120%;
}

/* Likely to  be one line */
/* 103% is prettier for two lines */
/* Hopefully Opera's user-agent stylesheet isn't fucking me over here */
h2, h3, .block-title, .viewsreference--view-title {
	font-size: 2.0em;
    line-height: 103%;
}

/* Also used in facets */

#content-below .block-facets-block h3.block-title {
    font-size: 1em;
}

/* ensures column 2 aligns with column 1 at top */
/* One colon, pseudo-class (Two colons: pseudo-elements (content)) */
/* Applied to all the H3s, not at all what I intended but looks good 
   with a smidgeon of whitespace after. */
   
#content-below .block-facets-block h3.block-title:first-of-type {
    margin-top: 0;
    margin-bottom: 0.66em;
}

.field--name-field-view-addendum .viewsreference--view-title {
    padding-bottom: 1em;
}

/* h3 in sidebars by convention */
#sidebar-right h3 {
    margin-top: .33em;
}

#sidebar-right .block-views h3, #block-zeropoint-dailyschedule h3, #block-zeropoint-dailyschedule-2 h3 {
    padding-bottom: 1em;
}

#sidebar-right #block-zeropoint-exposedformsearchpage-1 h3 {
    padding-bottom: 0;
}

h4 {
	font-size: 1.3em;
    line-height: 66%;
}

h5 {
	font-size: 1.2em;
    line-height: 66%;
}

h6 {
	font-size: 1em;
    line-height: 66%;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Containers                                                                   */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* Only paragraphs in content, for a proper-sized bullet in Water Cooler and Words */

.node__content p {
    font-family: "Bullet",'Crimson Pro', serif;
}


blockquote {
     font-style: normal;
     border-left: double;
     border-left-width: 4px;
     border-left-color: #CCCCCC;
}

blockquote blockquote {
     font-style: normal;
     border-left: solid;
     border-left-width: 4px;
     border-left-color: #F5F5F5;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Running text                                                                 */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

strong {
    font-weight: 700;
}

/* for blocks */
code {
    font-family: "Inconsolata", monospace;
    font-size: .85em;
    font-weight: normal;
}

/* for inline */
/* monospace wordspacing is ugly in running text */
tt {
    font-family: "Inconsolata", monospace;
    font-size: .9em;
    font-weight: lighter;
    word-spacing: -0.3em;
}

.dingbat {
   font-family: "Noto Sans Symbols 2";
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Footnotes and sidenotes                                                      */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* No module needed for footnotes, just markup */

a.fn-marker, a.fn-text  {
    font-family: 'Cabin', sans-serif;
}

/* Messing about with vertical-align seems to fuck up the leading (wrong)
   but these setting seem to minimize the damage */
a.fn-marker, a.fn-text  {
    color: #C70039;
    font-weight: 700;
    font-size: 66%;
    vertical-align: top;
    border-bottom-style: none;
}

a.fn-marker::before, a.fn-text::before {
    content: "[";
}

/* note space after */
a.fn-marker::after, a.fn-text::after {
    content: "] ";
}

/* Depends on sidenote contributed module */

/* applied to SUP tag, ick */
.sn-ref-link {
    font-family: 'Cabin', sans-serif;
    color: #C70039 !important;
    font-style: italic;
    font-weight: bold;
    border-bottom-style: none;
}
.sn-ref::before {
    content: ">>";
    color: #C70039 !important;
}

.sn-note-number {
    font-family: 'Cabin', sans-serif;
    color: #C70039 !important;
    font-size: .85em;
    font-style: italic;
    font-weight: bold;
}

.sn-note {
    border-top: 1px dotted #3333;
    padding-bottom:.5em;
}

.sn-note-content {
    padding-top: .5em
}

.sn-note::after {
    content: "❡";
    font-size: 1em;
    padding-bottom: 1em;
    color: #C70039;
    font-family: "NotoSansSymbols2-Regular";
    text-align: center;
    display: block;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Rubrics                                                                      */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* "Rubrics OUGHT to be red" --DJG */
/* As are note markers, above */
/*
.node-page .node__content .is-term .field__label {
    font-family: Cabin;
    font-size: .85em;
    font-weight: bold;
    color: #C70039;
}
*/

.node-page .node__content .is-term .field__label {
    color: #C70039;
}

/* I don't know why the item is below the baseline (not the underline). So it goes. */
/* 1em seems extreme, as if a "snap to" were acting, but it worked. */
/* Ultimately settled on .2em in the Inspector. .1em does NOT work */
/*
.node-page .node__content .is-term .field__item {
    font-family: Cabin;
    font-size: .85em;
    vertical-align: .2em;
    font-weight: normal;
}
*/

.node-page .node__content .is-term .field__item {
    vertical-align: .2em;
}

/* This horrid hack is needed because when blogroll page and block were one view,
   the page view was unborkably borked. So I separated the views. But then then
   blogroll block "more" link did not work. Hence this hack, where the blogroll
   href is hard-coded. */
   
#sidebar-right .view a[href="/blogroll"] {
    display: block;
    text-align: right;
    margin-top: 1em;
    margin-right: 1em;
    font-weight: bold;
    color: #C70039;
    border-bottom: none;
}

#sidebar-right .view a[href="/blogroll"]::after {
    content: "…";
}

/* Author/date info jammed against tagging info */

.node__submitted {
    margin-bottom: .5em;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> TOC                                                                          */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* depends on toc_filter module */
/* Optimized for Water Cooler */

/* generated toc container */


.toc-responsive {
    font-family: 'Cabin', sans-serif;
    font-size: .85em;
}

.toc-responsive .toc-tree {
    margin: 0;
    padding: 0;
    border: 0;
}

/* in the text */
/* "+" because no effing container */
a[href="#top"] + h6 {
    font-size: .85em;
    color: #C70039;
}

.back-to-top {
   float: left; 
   position: relative;
   top: .6em;
   margin-right: .25em;
}

/* Module wraps ENTIRE TOCed content in a container and then adds
   a back-to-top buttom at the bottom of the container. No. */

.toc-filter a.back-to-top:last-of-type {
    display: none;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Branding                                                                     */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#site-name {
    display: none;
}

/* default width is 2.5em, far too small on mobile */
.logoimg {
   width: auto;
   height: auto;
   min-height: 5em;
 }

a.site-logo {
    border: none;
}

/* background for readability against the rotating photos */
#name-and-slogan .site-slogan {
   font-family: 'Cabin', sans-serif;
   font-weight: bold;
   font-style: italic;
   display: inline-block;
   float: right;
   text-align: right;
   color: #C70039;
   background: linear-gradient(to right, rgba(210,240,240,0), rgba(210,210,210,1));
}

/* working on fixing the whitespace issue at the top of the rotating image */
#headimg {
    border-top: 1px dotted #333333;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Site machinery (by region)                                                   */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* >>> Regions                                                                     */
/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */

/* Content (html) is serif, the default. Machinery is sans-serif, by regions. */

/*  primary menu
    secondary menu
    sidebar second
    content tabs
    content primary admin actions 
    footer
*/

/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* >>> Sidebars                                                                    */
/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */

/* used in sidebars */
ul.links.inline {
    font-family: 'Cabin', sans-serif;
}

/* dupes? */
/* Sidebar views: Give the view title more air */
.viewsreference--view-title {
    margin-top: 1em;
    margin-bottom: .2em;
}

#sidebar-right .view-content .views-field-title {
    line-height: 1.4em;
    margin-bottom: .2em;
}

/*  Sidebar views: Tighten up those rows! */
#sidebar-right .view-content {
    line-height: 1.4em;
}

/* Not sure what these twp are doing */
/* "it fucks up the sidebar blocks" was my comment on the latter */
#sidebar-right .field--type-text-with-summary {
    margin-top: 0;
}

.field--type-text-with-summary {
   margin-top: 1.6em;
}

/* date block in sidebar */
.simple-date-block {
    margin-top: 1em;
}
.simple-date-block::before {
   font-weight: bold;
   content: "Now: ";
}

/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* >>> Menus and tabs                                                              */
/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */

#block-zeropoint-secondarynavigation, #sidebar-right, 
#middlecontainer > #block-zeropoint-local-tasks, #footer {
    font-family: 'Cabin', sans-serif;
    font-weight: normal;
    font-size: .85em;
    line-height: 1.6em;
}

#body_right #submenu div.region-secondary-menu ul {
       text-align: left;
}

.pure-menu-item, .menu-item, .form-actions, .form-item, .form-select,
.tabs, .links .inline {
     font-family: 'Cabin', sans-serif;
     font-size: .85em;
}

.option {
    font-size: 1em;
}


/* line-height determines the height of the main menu boxes (ick) */
#block-zeropoint-main-menu {
    font-family: 'Cabin', sans-serif;
    font-weight: normal;
    font-size: .85em;
    line-height: 1em;
}

#header div.region-topreg li.menu-item a {
   font-weight: bold;
   border-bottom: none !important;
}

#block-zeropoint-local-tasks .tabs.primary {
  padding: 0;
  line-height: 1em;
}

#toolbar-item-user {
   display: none;
}

/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* >>> Links (bottom of the post)                                                  */
/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* horrid atavistic use of "links" */

.node__links {
    font-family: 'Cabin', sans-serif;
}

.field--type-entity-reference .field__item:last-of-type, .node__links li:last-of-type {
  padding: 0;
}

/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* >>> Messages                                                                    */
/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */

.messages {
    font-family: 'Cabin', sans-serif;
    font-weight: normal;
    font-size: .85em;
    line-height: 1.6em;
    margin-left: .4em;
}

/* box-shadow: -8px 0 0 #DCDCDC; */
.messages--status {
    color: #333333;
    border-color: #333333 #333333 #333333 transparent;
    background-color: #DCDCDC;
    margin-bottom: 1.5em;
    margin-left: 8px;
}

/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* >>> Footer                                                                      */
/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */

#footer {
    font-family: 'Cabin', sans-serif;
    background-image: linear-gradient(to bottom, rgba(210,240,240,0), rgba(210,210,210,1));
}

.region-footer {
    font-family: 'Cabin', sans-serif;
}

#block-zeropoint-visitors, #block-zeropoint-visitors p  {
    margin-bottom: 0;
    padding-bottom: 0;
}

#block-zeropoint-attribution {
    margin-top: 1em !important;
    text-align: left;
}

#block-zeropoint-attribution .block-content:before {
    content: url(images/24px-CC_BY-NC-SA.svg.png);
}

#footer .pure-u-1.pure-u-md-1-5, .pure-u-1.pure-u-md-1-5 {
    display: none;
}

/* remove effing flex */
#footer.pure-g {
    display: block;
}

/* Goodness what a PITA finding this was */
@media screen and (min-width: 48em) {
    #footer .pure-u-md-3-5 {
        width: 80%;
    }
}

/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* >>> Affordances                                                                 */
/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */

/* The only rounded corners */

input[value="Save"] {
    font-family: Cabin;
    font-weight: bold;
    color: #2E6F40 !important;
    background-color: #FFFFFF !important;
    border: solid 1px #333333;
    border-radius:0.5em;
}

input[value="Search"] {
    font-family: Cabin;
    font-weight: bold;
    color: #2E6F40 !important;
    background-color: #FFFFFF !important;
    border: solid 1px #333333;
    border-radius:0.5em;
}

input[value="Apply"] {
    font-family: Cabin;
    font-weight: bold;
    color: #2E6F40 !important;
    background-color: #FFFFFF !important;
    border: solid 1px #333333;
    border-radius:0.5em;
}

input[value="Submit"] {
    font-family: Cabin;
    font-weight: bold;
    color: #2E6F40 !important;
    background-color: #FFFFFF !important;
    border: solid 1px #333333;
    border-radius:0.5em;
}

/* MacOS Yellow: "Caution" */
input[value="Preview"] {
    font-family: Cabin;
    font-weight: bold;
    color: #FFC000 !important;
    background-color: #FFFFFF !important;
    border: solid 1px #333333;
    border-radius: 0.5em;
}

input[value="Reset"] {
    font-family: Cabin;
    font-weight: bold;
    color: #FFC000 !important;
    background-color: #FFFFFF !important;
    border: solid 1px #333333;
    border-radius: 0.5em;
}

/* BEF */
/* Combination of Zeropoint (pure css) and BEF, both very opinionated, when formatting
   search API page was a real PITA */

details.bef--secondary {
    margin-top: 0;
}

/* I don't know why .8em but it looks better. */

details.bef--secondary summary {
    font-family: Cabin;
    font-size: .8em;
}

/* Search API block */

#sidebar-right .form-type-search {
    margin-right: 1em;
}

/* tighten up the box */
#sidebar-right #block-zeropoint-searchapiform {
    line-height: 1em;
    margin-top: 0;
    padding-top: 0;
}

#edit-search-api-fulltext {
    width: 100%;
}

#sidebar-right #block-zeropoint-searchapiform .block-content::after {
    content: "Refine your search on the results page.";
    font-family: Cabin;
    font-size: .85em;
}



/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */
/* >>> Footer affordances                                                          */
/* . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . */

.print__link--pdf {
    font-family: 'Cabin', sans-serif;
    display: block !important;
    margin-top: 2em;
    font-weight: bold;
}

.print__wrapper--pdf a:not(.ext) {
    font-family: 'Cabin', sans-serif;
}

.print__wrapper--pdf a:not(.ext) {
     border: none;
     color: #C70039;
}

.print__wrapper--pdf::after {
    font-family: 'Cabin', sans-serif;
    content: "(Post only, small file).";
    margin-bottom: 1em;
}

.statistics-counter {
    font-family: 'Cabin', sans-serif;
    display: block !important;
    margin-top: 2em;
    margin-left: .5em;
}

.statistics-counter:before {
    font-family: 'Cabin', sans-serif;
}

/* ******************************************************************************* */
/* > ZEROPOINT RESPONSIVE GEOMETRY                                                 */
/* ******************************************************************************* */

/* Text menu (desktop) flush left; hamburger (mobile) flush right */
/* value from yml breakpoints: 35.5 48 64 80 */

/* PRIMARY MENU */
/* 35.5 48 64 80 */
@media (min-width: 35.5em) {
    div.region-primary-menu {
       float: right;
    }
}

@media (min-width: 48em) {
    div.region-primary-menu {
       float: right;
    }
}

@media (min-width: 64em) {
    div.region-primary-menu {
       float: left;
    }
}

@media (min-width: 80em) {
    div.region-primary-menu {
       float: left;
    }
}

/* SECONDARY MENU */
/* 35.5 48 64 80 */
/* mobile */
/* note use of max-with v. mim-width for narrowest mobile */

/* NOTE side-notes has mobile settings, but sadly in px. Used 390 */

@media (max-width: 35.5em) {
    #submenu {
      margin: 0;
    }
}

@media (min-width: 35.5em) {
     #body_right #submenu {
       float: left;
       margin-left: 0;
    }
}

@media (min-width: 48em) {
     #body_right #submenu {
       float: left;
       margin-left: 0;
    }
}


/* desktop */
/* setting the margin left seems like a horrible hack */
@media (min-width: 64em) {
       #body_right #submenu div.region-secondary-menu ul {
       margin-left: 1.25em;
    }
}

@media (min-width: 80em) {
   #body_right #submenu div.region-secondary-menu ul {
       margin-left: 1.25em;
    }
}

/* ******************************************************************************* */
/* > USER LOGIN, USER PAGES                                                        */
/* ******************************************************************************* */

.logged-out #submenu .region-secondary-menu li.menu-item {
    color: #C70039;
}

/* Margin not same as button */
#block-zeropoint-userlogin .item-list ul {
        list-style-type: none;
        padding-left: 2px;
}

#block-zeropoint-userlogin .item-list li > a.create-account-link {
    display: none !important;
}

.logged-out #submenu .region-secondary-menu li.menu-item > a[title="my-account"] {
    display: none !important;
}

.logged-out #submenu .region-secondary-menu li.menu-item > a[title="logout"] {
    display: none !important;
}

.logged-out #block-zeropoint-local-tasks .tabs.primary {
    padding: 0;
}

/* user page */

.logged-in #block-zeropoint-local-tasks ul {
     padding: 0;
}

/* ******************************************************************************* */
/* > FRONT PAGE                                                                    */
/* ******************************************************************************* */

/* The front page is a view */

/* In case frontpage needs different formatting from node */
.front .node__submitted  {
    margin-top: 1em;
    font-family: 'Cabin', sans-serif;
    font-weight: normal;
    font-size: .85em;
    line-height: 1.6em;
}

.front .field--type-text-with-summary {
    margin-bottom: 0;
    padding-bottom: 0;
}

.front .node__links {
    margin: 0 -.5em;
    clear: both;
}

.front .node__links .node-readmore a, .front .node__links .comment-comments {
    font-size: .85em;
    margin-top: 0em;
    margin-bottom: 0em;
    padding-bottom: 0em;
}

.front .node__links .node-readmore a {
    font-weight: 700;
    color: #C70039;
}

.front .node__links .node-readmore a:after {
    content: "…";
}

/* unwanted separator for multiple items in so-called links */
.front .node__links li {
    border-right: none;
}

/* Comment formatting is odd, but this turns comments off entirely! */
/* Yet another example of the infernal links field */
/* No, I was right to nuke this, it's redundant */
/* Testing, the comment form appears when there are no comments, without this link appearing */

.node__links .comment-add {
    display: none !important;
}


/* Different top margin from a post because a post has comment machinery. */
.front .statistics-counter {
    font-family: 'Cabin', sans-serif;
    font-size: .85em;
    display: block !important;
    margin-top: 0em;
    margin-left: .5em;
}

/* ******************************************************************************* */
/* > SEARCH PAGES                                                                  */
/* ******************************************************************************* */

/* View constructed with Search API */

/* Facet filters were orignally formatted with Better Exposed Filters (BEF). But BEF
   doesn't allow more than one collapsible "details" block. After a false start with 
   Configurable Views Filter Block (CVFB, but filters ≠ facets), I settled on Facets
   Block which places filters using the block layout system, and allows as many 
   collapsible blocks as I need (in this case, there are seven filter categories, 
   some with several facets, hence seven blocks). The facets team recommends
   Facets Exposed Filters (FEF), which works directly within views. However, the 
   block system is robust, and offers collapsible blocks. Further, FEF relied on
   Better Exposed Filters (BEF), and as of this writing, BEF and Tagify are not
   compatible with each other.
   
   UPDATE I got rid of all but two collapsiblocks, for help. Nevertheless, sticking
   with simple and rugged blocks.
*/
   
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Search form                                                                  */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */   

/* Removing that effing opinionated float sure solves a lot of problems */
.form--inline .form-item {
    float: none;
    margin-right: 0.5em;
}


.view-fulltext-search .view-header h6, .view-doge-fulltext-search-content .view-header h6 {
    font-size: 1em;
    font-weight: bold;
    padding-bottom: 1em;
}

/* Override opinionated .pure-form select */
#edit-search-api-fulltext-op--3 {
  height: 2.7em;
}
   
/* ditto */
.pure-form legend {
    border: none;
} 

.view-filters .views-exposed-form .form--inline .form-item legend {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.view-fulltext-search #middlecontainer .block {
    margin: 0;
}

#edit-search-api-fulltext-wrapper .form-item {
    margin-top: 0;
}

/* should be a rubric but that looks like work and there is also a default tooltip
   from the external links module */
a.full-text-search-original::hover {
    display: block;
}

#collapse-zeropoint_introtofacetfilters .collapsiblockTitle button h3 {
    margin-left: 0;
    font-size: .85em;
}


/* Save search module */

/* I don't care, bl needs a border, being in the midst of two huge forms */
/* No background shading, it's not content */

.layout-content .block-wrapper #block-zeropoint-savesearch {
    display: block;
    font-family: Cabin;
    font-size: .85em;
    margin-top: 2em;
    padding-top: 0;
    padding-bottom: 1em;
    padding-right: 1em;
    width: fit-content;
    border: 1px solid #CCCCCC;
}

#collapsiblock-wrapper-zeropoint_savesearch {
   margin-top: 0;
   margin-left: 0;
   padding-left: 1em;
}

#collapse-zeropoint_savesearch-content {
    margin-left: 1em;
}

/* another horrid relative font hack */
.search-api-saved-search-default-create-form .form-composite > .fieldset-wrapper > .search-api-saved-search-default-create-form .description, .form-item .description {
    font-size: 107%;
}


/*
#saved-search-notification {
   font-family: Cabin;
}
*/

input[value="Save search"] {
    font-family: Cabin;
    font-weight: bold;
    color: #2E6F40 !important;
    background-color: #FFFFFF !important;
    border: solid 1px #333333;
    border-radius:0.5em;
}

/* position the triangle (varies by the point size of the title. */
/* TODO consolidate this mess */
#block-zeropoint-savesearch .collapsiblockTitle button, 
#collapsiblock-wrapper-zeropoint_savesearch .collapsiblockTitle button {
  display: block;
  width: 100%;
  margin-left: 0;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 1em;
  background-position-y: 90%;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Facet Filter Blocks                                                          */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* Stick all the facets in one region beneath the main search result */
/* #content-below being region in zeropoint */
#content-below {
    column-count: 2;
    column-gap: 1em;
}

/* don't break up facet blocks when breaking columns */
#content-below .block-facets-block {
    break-inside: avoid;
}

/* Effing masonry */

#block-zeropoint-leadintosummary p {
    margin: 0 !important;
    padding: 0 !important;
}

#block-zeropoint-leadintosummary .field--type-text-with-summary {
    font-family: 'Cabin', sans-serif;
    margin: 0 !important;
}

/* Fonts and white space for all facets, as tweaked below. */
#content-below .facet-block {
    font-family: 'Cabin', sans-serif;
    font-weight: normal;
    font-size: .85em;
    line-height: 1.3em;
    margin-top: .5em;
    margin-bottom:0;
    margin-left: 1em;
    margin-right: 1em;
    padding: 0;
}

ul.facets-widget-searchbox-list, ul.item-list__date_range  {
    color: #333333;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    list-style-type: none;
}

ul.facets-widget-searchbox-list li label {
    font-weight: normal;
}

ul.facets-widget-searchbox-list li.facets-reset label {
    font-weight: bold;
}

.facet-block__title {
   margin-top: .0;
   margin-bottom: .5em !important;
   color: #C70039;
}

.facet-block__title::before {
   color: #333333;
   content: "Facet: ";
}

/* I am a bad person. I hacked facets-item-list--searchbox-checkbox.html.twig at 
   line 27 to change the text in the search box from "Search..." to "Type name..." 
   because to users "Search" for a facet name in a list is not the same as "Search" 
   on the page. */

/* Fighting some opinionated CSS here */
 .facets-widget-searchbox-list .facet-block .facet-block__content .facets-widget-searchbox_checkbox input.facets-widget-searchbox {
    margin-bottom: .5em !important;
}

/* triangles for the facets */
a.facets-soft-limit-link {
    font-size: .85em;
    border-bottom: none;
    margin-left: 1em;
}

/* Clicky triangles look naked at a small scale */
a.facets-soft-limit-link::after {
    content: " More…";
}

a.facets-soft-limit-link.open::after {
    content: " Less";
}

#block-zeropoint-introtofacetfilters  {
    margin-left: 0;
}

/* Yes, horrid calc hack to decompound font-size */
.facets-widget-searchbox-list button h3 {
   font-size: calc(.85em * 1.17);
   font-weight:  bold;
   position: relative;
   top: -.5em;
}

/* triangles for the facet blocks */
/* [x] Move clicky triangle close to the text. */
/* [ ] Make the triangle a rubric ("background: url(data..)" WTF?) */
/* [x] Move triangle to baseline. H3 is INSIDE the button, so see above. */
/* [x] Move facet flush left */
/* CSS shorthand from margin: t/b, l/r */
.facets-widget-searchbox-list button {
    width: max-content;
    margin-right: 20px;
    margin-left: 0;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 20px;
    padding-left: 0;
}

/* facet alignment inside filter */

.facets-widget-searchbox-list {
    margin-left: 1em;
}

.facets-widget-searchbox-list form label {
    vertical-align: top !important;
}

/* separates checkbox from list item. Not sure how this broke */
span.facet-item__value::before {
    content: ' ';
}

/* hide the facets */
/* Leaving the facet SECTIONS visible causes no problems and in fact informative */
/* But individual blank facets are confusing. */

/* https://tobiasahlin.com/blog/hiding-an-element-if-its-empty/ */
/* Hostinger's CSS parser throws an  error but the code is correct */

.block-content:has(.facet-block__content:empty) {
   display: none;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Help                                                                         */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* Split search and facet help into separate blocks (and must now wrestle 
   collapsiblock into submission once more */
   
#block-zeropoint-helpfulltextsearch, #collapsiblock-wrapper-zeropoint_helpfulltextsearchresultfilters,
#block-zeropoint-helpdogefulltextsearch, #collapsiblock-wrapper-zeropoint_helpdogefulltextsearchresultfilters {
    margin: 0;
}

/* Help block styling

   [x] Add a (?) rubric
   [x] Text flush left 
   [x] Clicky triangle (background) abuts text instead of being flush right
   [x] Clicky triangle positioned at baseline
   [x] Block when uncollapsed has gradient (a box created whitespace issues)

*/

/* Over-riding the collapsiblock modules CSS */
/* background-position-y controls the vertical position of the clicky triangle */
/* padding-right 25px -> 1em */
#block-zeropoint-helpfulltextsearch .collapsiblockTitle button, 
#block-zeropoint-helpfulltextsearchresultfilters .collapsiblockTitle button,
#block-zeropoint-helpdogefulltextsearch .collapsiblockTitle button, 
#block-zeropoint-helpdogefulltextsearchresultfilters .collapsiblockTitle button 
{
  display: block;
  width: 100%;
  margin-left: 0;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 1em;
  background-position-y: 100%;
}

.collapsiblockTitle {
    max-width: fit-content;
}

/* happily the margin whitespace appears when the box is uncollapsed */
#collapse-zeropoint_helpfulltextsearch-content .field--type-text-with-summary,
#collapse-zeropoint_helpdogefulltextsearch-content .field--type-text-with-summary 
{
   margin-top: 1em;
   margin-bottom: 1em;
   background-image: linear-gradient(to bottom, rgba(210,240,240,0), rgba(210,210,210,.5));
}

#collapse-zeropoint_helpfulltextsearch-content p, #collapse-zeropoint_helpfulltextsearch-content ol,
#collapse-zeropoint_helpdogefulltextsearch-content p,  #collapse-zeropoint_helpdogefulltextsearch-content ol 
{
   margin-top: 0;
   margin-bottom: 0;
}

#block-zeropoint-helpfulltextsearch .collapsiblockTitle button h3, 
#block-zeropoint-helpfulltextsearchresultfilters .collapsiblockTitle button h3,
#block-zeropoint-helpdogefulltextsearch .collapsiblockTitle button h3, 
#block-zeropoint-helpdogefulltextsearchresultfilters .collapsiblockTitle button h3
{
    font-size: .85em;
    font-weight: normal;
}

/* not sure why a normal trailing space gets eaten, but pasting a Unicode space works */
/* https://unicode-explorer.com/c/2009 */
#block-zeropoint-helpfulltextsearch button h3:before, #collapsiblock-wrapper-zeropoint_helpfulltextsearchresultfilters button h3:before, 
#block-zeropoint-helpdogefulltextsearch button h3:before, #collapsiblock-wrapper-zeropoint_helpdogefulltextsearchresultfilters button h3:before 
{
    font-family: 'FontAwesome';
    font-size: 1em;
    font-style: normal;
    color: #C70039;
    content: "\f059 ";
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Summary                                                                      */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#block-zeropoint-leadintosummary .field--type-text-with-summary p {
    font-size: .85em;
}


.block-facets-summary {
    font-family: 'Cabin', sans-serif;
    font-weight: normal;
    font-size: .85em;
    line-height: 1.3em;
    margin: 0;
}

.block-facets-summary .block-content ul {
    list-style-type: none;
}

.block-facets-summary .content li span.source-summary-item {
    font-weight: bold;
}

.block-facets-summary .content li > span.source-summary-count {
    color: orange;
    margin-bottom: .5em;
}

.facet-summary-item--clear {
    margin-top: 1em;
}

/* reset, hence #FFC000 */
.facet-summary-item--clear a {
    font-weight: bold;
    color: #FFC000;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* >> Search Hits                                                                  */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */


/* Search API defaults to the STRONG tag for its highlight style so leverage that. */
.search-result_highlight, .views-table td strong {
  background-color: #FFE135;
  font-weight: normal;
}


/* ******************************************************************************* */
/* > LINK COLORS AND DECORATION                                                    */
/* ******************************************************************************* */

/* External links are given an icon by the External Links module */

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Internal: Electric Blue                                                         */ 
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* A links internal (content) */
/* Had some odd solid rules, so reinforced dotted */

/* !important to over-ride the very opinionated grey.css from the theme */
a:not(.ext) {
   border-bottom-color: #1C1EFE !important; 
   border-bottom: 1px dotted;
}

/* logically should be underlined, but the look is too busy */
.view-frontpage-content h2 a {
     border-bottom: none;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Terms: Lime Green                                                                      */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* A links internal (term) */

div.is-term a {
  border-bottom-color: #28b463;
  border-bottom: 1px dotted;
}

/* added manually to sidebars for e.g. schedule */
a.is-term {
  border-bottom-color: #28b463 !important;
}

.field--name-field-tags a {
  border-bottom-color: #28b463;
  border-bottom: 1px dotted;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Internal (admin): Charcoal                                                      */ 
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.node__meta a, .tabs a, div.messages a, a.username, div.view-archive a, div.node__links a {
  border-bottom-color: #333333;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* External (blogroll): Charcoal                                                   */ 
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.views-field-field-blog-link a {
   border-bottom-color: #C0C0C0;
}

/* Exclude links inside these CSS selectors" in External Links module fails */

.view-blogroll a span svg, .view-blogroll-page a span svg, 
.views-field-field-blog-rss a span svg {
    display: none;
}



/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Miscellaneous                                                                   */ 
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* over-ride bible module */

.bible-reference  {
    text-decoration: none;
}

/* ******************************************************************************* */
/* > TWEETS                                                                        */
/* ******************************************************************************* */

/* Is that flex crap gonna interfere? */

.twitter-tweet {
    display: block !important;
    max-width: none !important;
}

.twitter-tweet iframe {
    width: 600px !important;
}

/* ******************************************************************************* */
/* > POSTS                                                                         */
/* ******************************************************************************* */

/*  Ems are relative and multiply, .85 * .85 e.g. So get the parent as high in the 
    tree as possible! */

.node__meta {
    margin-top: 1em;
    font-family: 'Cabin', sans-serif;
    font-weight: normal;
}

.node__content .field--name-field-topic {
    font-family: 'Cabin', sans-serif;
    font-size: .85em;
}

.node__content .field--name-field-topic .field__label {
    font-weight: bold;
    color: #C70039;
}

/* Tags at the bottom, around which there should be an effing container */

div.field--type-entity-reference.is-term {
    font-family: 'Cabin', sans-serif;
    font-weight: normal;
    font-size: .85em;
}

div.field--type-entity-reference.is-term .field__label {
    font-weight: bold;
    color: #C70039;
}

/* not a rubric */
div.field--name-field-excerpt .field__label {
    font-family: 'Cabin', sans-serif;
    font-weight: bold;
    margin-top: 1em;
}


/* ******************************************************************************* */
/* > COMMENTS                                                                      */
/* ******************************************************************************* */

.comment__meta .comment__submitted {
    margin-top: 1em;
    line-height: 1.6em;
}

.comment__meta p.comment__submitted {
    font-family: 'Cabin', sans-serif;
    font-weight: normal;
    font-size: .85em;
}

/* for the so-called "links" field */
/* These should not look like links,  but buttons */
li.comment-delete, li.comment-edit, li.comment-reply {
    font-size: .85em;
    width: max-content; 
    background-color: #FFFFFF !important;
    border: solid 1px #333333;
    border-radius:0.5em;
    padding: .25em !important;
    margin-right: .66em !important;
}

li.comment-delete a {
    font-weight: bold;
    color: #C70039;
    border: none;
}

li.comment-edit a {
    font-weight: bold;
    color: #FFC000;
    border: none;
}

li.comment-reply a {
    font-weight: bold;
    color: #2E6F40;
    border: none;
}

.comment-comment-form {
    background-color: #FFFFFF;
    border: solid 1px #333333;
    padding: 1em;
}

section.field--name-comment {
    margin-top: 1em;
    border-top: 1px dotted #333333;
}

.comment-wrapper {
    background-image: linear-gradient(to bottom, rgba(210,240,240,0), rgba(210,210,210,1));
}

article.comment {
  padding-left: 1em;
}

.comment-wrapper {
    padding-top: 0;
    padding-bottom: 1em;
    padding-right: 1em;
    padding-left: 1em;
}

/* Why the heck h2 and why can't it be changed in the UI? */
.comment-wrapper h2.title {
    padding-left: 0;
    padding-top: 1em;
    padding-bottom: 1em;
}

.comment-wrapper h2.comment-form__title {
    font-size: 1em;
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 1em;
}

.comment div.comment-title {
    margin-top: 1em;
    margin-bottom: 1em;
    padding-top: 0;
}

.comment div.comment-title h3 {
	font-size: 1.3em;
    line-height: 120%;
}

/* Over-riding default palette */
.comment div.comment-title h3 a { 
    border-bottom: none;
}

.comment-wrapper  ul.links li {
   margin-left: 0;
   padding-left: 0;
}


/* remove stupid image, fix margin */
.comment-title {
    background: none;
    padding-left: 0;
}

li.comment-add {
    margin-top: 1em;
}


/* from Antispam by CleanTalk */
.field--type-comment .comment-approve a {
    font-weight: 700;
    color: #C70039;
}

.field--name-field-comment-tags {
    margin-bottom: 1em;
}

/* ******************************************************************************* */
/* > RSS LOGO, the horror                                                          */
/* ******************************************************************************* */

/* Used at the bottom of pages, and in the blogroll block, replacing link text */
/* My code here is really horrid, but the theme and Drupal defaults are horrid too. */

div.view-id-frontpage div.feed-icons {
    display: block;
    margin-top: 1em;
}



/* For my RSS block */

/* the trick to center divs */


#block-zeropoint-rsslink div {
  margin: auto;
  width: 50%;
}

/* over-rides block formatting for .feed-icon class */
#block-zeropoint-rsslink div p .feed-icon {
    display: inline !important;
}

.vocabulary-topics .feed-icons {
    text-indent: 0;
    text-align: left;
}

/* The background icon does not appear when there is no content in the link, so &nbsp;'s are added */

.vocabulary-topics .feed-icons .feed-icon:before {
        content: "\00a0\00a0\00a0\00a0";
}

/* color: black; */
.vocabulary-topics .feed-icon {
    display: inline;
    overflow: hidden;
    width: 16px;
    height: 16px;
    background: url(/themes/contrib/zeropoint/images/core/feed.svg) no-repeat;
}

/* push RSS logo left */
.views-field-field-blog-link a::after {
     content: "\00a0";
}

/* ******************************************************************************* */
/* > BLOGROLL, the horror                                                          */
/* ******************************************************************************* */

/* Lets just reassemble from old pieces since Views has revised away my ability 
   to use the old hacks. Tasks:
   
   - Make all the divs, of which there are many superfluous, inline
   - Attach the RSS logo after the link, it should be clikable (ha ha)
   
   I have little expectation this approach will work, because it's been cursed
   from the beginning */
   
/* Views settings for RSS link field arrived at after experimentation:

   - Formatter: Link
   - Style settings: Add default classes
   - Rewrite: Trim to a maximum number of characters where value is 0 (!!)
   - turn off [x] for adding ":" after shortening

   End up with a URL in the body of the A, which is generally long, but the
   suppresses this.
*/
   
.view-blogroll div:not(.views-row) {
    display: inline;
}

/* Transparent means the URL in the body of the A tag does not show,
   although the RSS logo after does. Overflow means the blocks are 
   not completely borked. */
   
.views-field-field-blog-rss a {
    color: transparent;
    display: inline;
    border-style: none !important;
    overflow: hidden;
    width: 1em;
    height: 1em;
    background: url(/themes/contrib/zeropoint/images/core/feed.svg) no-repeat;
}

/* Need something for RSS background icon to display in */

.views-field-field-blog-rss a {
        content: "\00a0\00a0\00a0\00a0";
}

/* no-wrap prevents breaks on "?" and "-" etc. in URLs" */
/* Hopefully I can abbreviate really long blog names, if any */
.views-field-field-blog-link .field-content, .views-field-field-blog-rss .field-content {
    white-space: nowrap;
}

/* 1.6 not 1.5em for the visual of the underline */
#block-zeropoint-views-block-blogroll-block-1 .views-row {
    line-height: 1.6em;
}

/* ******************************************************************************* */
/* > PULLED QUOTE                                                                  */
/* ******************************************************************************* */

/* Best to leave this guy in the text flow of paragraphs, and not in a table, e.g. */

.pulled-quote {
   font-family: "Crimson Pro", serif;
   font-style: italic;
   font-size: 1.33em;
   line-height: 1.4em;
   text-align: left;
   padding-left: 2em;
   padding-right: 2em;
   padding-bottom: 1em;
   border-top: 1px dotted #33333;
   border-bottom: 1px dotted #33333;
   background-image: linear-gradient(to bottom, rgba(210,240,240,0), rgba(210,210,210,.5));
}

.pulled-quote::before {
    content: "❧";
    font-size: 1.5em;
    padding-bottom: .5em;
    color: #C70039;
    font-family: "NotoSansSymbols2-Regular";
    text-align: center;
    display: block;
}

/* ******************************************************************************* */
/* > TABLES                                                                        */
/* ******************************************************************************* */

/* Really do not like authored on break, but sadly there is no way to insert 
   a non-breaking space in the view labels */
   
/* not just sticky enabled! */ 

/* .view-content compounds */
.view-header, .view-footer {
    font-family: 'Cabin Condensed', sans-serif;
    font-size: .85em;
    line-height: 1.4em;
}

/* over-rides pure css */
table, table tr, table th, table td {
    font-family: 'Cabin Condensed', sans-serif;
    font-size: .85em;
    line-height: 1.4em;

}

/* Horrid hack for handmade tables in sidebars to defeat em compounding */
#block-zeropoint-dailyschedule table, #block-zeropoint-dailyschedule table tr, 
#block-zeropoint-dailyschedule table th, #block-zeropoint-dailyschedule table td,
#block-zeropoint-dailyschedule-2 table, #block-zeropoint-dailyschedule-2  table tr, 
#block-zeropoint-dailyschedule-2 table th, #block-zeropoint-dailyschedule-2 table td
{
    font-size: calc(.85em * 1.17);
}

th {
    font-weight: 700;
    text-wrap: pretty;
    vertical-align: top;
}

td {
    text-align: left;
    text-wrap: pretty;
    vertical-align: top;
}

/* With full text search, triggers a server call and the hit table disappears. */
/* Don't know how to do AND NOT ... */
body:not(.view-fulltext-search) th.views-field a[title^="sort by"] {
  border-bottom-color: #FFFFFF !important;
}

/* Default search has no sorting */
.view-doge-fulltext-search-content .form-item-sort-by {
    display: block;
}

/* ******************************************************************************* */
/* > SHUTTING DOWN SIDEBARS FOR LARGE TABLE DISPLAYS                               */
/* ******************************************************************************* */

/* FULL PAGE NO SIDEBARS: Timelines, term pages */

/* .taxonomy.term .pure-u-1 */

.view-doge-fulltext-search-content .pure-u-1,
.view-fulltext-search .pure-u-1,
.timelines .pure-u-1,
.trials-trump-administration .pure-u-1,
.tracking-lawsuits-against-trumps-agenda .pure-u-1,
.doge-timeline-faq .pure-u-1 {
    width: 100%;
    padding-right: 1em;
}

/* .taxonomy.term .pure-u-1 #sidebar-right */
.view-doge-fulltext-search-content #sidebar-right,
.view-fulltext-search #sidebar-right,
.timelines #sidebar-right, 
.trials-trump-administration #middlecontainer #sidebar-right,
.tracking-lawsuits-against-trumps-agenda #middlecontainer #sidebar-right,
.doge-timeline-faq #middlecontainer #sidebar-right
{
    display: none;
}

/* ******************************************************************************* */
/* > FAQ MODULE                                                                    */
/* ******************************************************************************* */

.ui-state-active, 
.ui-widget-content .ui-state-active, 
.ui-widget-header .ui-state-active, 
a.ui-button:active, 
.ui-button:active, 
.ui-button.ui-state-active:hover
 {
    border: 1px solid #333333 !important  /*{borderColorActive}*/;
    background: #DCDCDC !important /*{bgColorActive}*/ /*{bgImgUrlActive}*/ /*{bgActiveXPos}*/ /*{bgActiveYPos}*/ /*{bgActiveRepeat}*/;
    font-weight: normal /*{fwDefault}*/;
    color: #333333 !important /*{fcActive}*/;
}

/* ******************************************************************************* */
/* > TERMS                                                                         */
/* ******************************************************************************* */

/* lists of terms in posts */

.field--type-entity-reference .field__items {
    text-wrap: pretty;
    word-break: keep-all;
}

.field--type-entity-reference .field__label {
    display: inline;
}

.field--type-entity-reference .field__items .field__item {
    color: red;
    border-right: none;
}


/* nuke default padding, we have a better separator */
.field--type-entity-reference.is-term .field__item, .node__links li {
    padding: 0;
}

/* Middle small bullet with NBSP either side */
.field--type-entity-reference .field__items .field__item::after {
    content: "  · ";
    color: #C70039;
}
/*
.field--type-entity-reference .field__items .field__item:last-of-type::after {
    content: "";
}
*/

/*
.field--type-entity-reference .field__items .field__item a {
    color: blue;
}
*/

/* term page */
.view-taxonomy-term .page-title::before {
    content: "Term: ";
    font-weight: 700;
    color: #333333;
}

.view-taxonomy-term .page-title {
    color: #C70039;
}

.field--name-field-employer .field-item::before {
    content: "Employer/Beneficiary: ";
    
}

/* term page */

.taxonomy-term {
    background-color: transparent;
    border: none;
    padding: .3em 1em;
    margin-bottom: 4em;
}

/* Dead view? */
/*
.view-all-terms .pure-u-1, .view-all-terms #main {
    width: 100%;
    padding-right: 1em;
}

.view-all-terms #sidebar-right {
    display: none;
}

.view-all-terms .views-view-grid h2 {
    font-family: 'Cabin', sans-serif;
    font-weight: normal !important;
    font-size: 16px;
    line-height: 24px;
}

.view-all-terms .views-view-grid .taxonomy-term {
    background-color: none !important;
    border: 1px solid #ddd;
    padding: 0 0 0 10;
    margin-bottom: 0;
}

.view-all-terms .views-view-grid .taxonomy-term h2 a {
    text-decoration: none;
    border-bottom: 1px dotted !important;
    border-bottom-color: #28b463 !important;
}

.view-all-terms .view-filters .js-form-item-sort-by {
    clear: both;
}

.view-all-terms .view-filters .js-form-item-sort-order {
    float: left;
}

.view-all-terms .view-filters .js-form-item-items-per-page {
    float: left;
}

#edit-terms-filter-wrapper--description {
 padding-top: 1.6em;
}
 
#edit-combine-wrapper--description {
    padding-top: 1.6em;
    display: inline-block;
    float: left;
}

#edit-combine-wrapper {
    border-bottom: 1px solid #e5e5e5;
}

.js-form-item-items-per-page::after {
    font-size: 0.85em;
    margin-top: -1em;
    content: "Select result display."
}

#edit-submit-all-terms {
   font-weight: bold;
}
*/

/* ******************************************************************************* */
/* > PINNED POST                                                                   */
/* ******************************************************************************* */

.view-frontpage-content .node--sticky {
   border: 1px solid #333333;
   padding: 1em;
   width: calc(100% - 1em);
   box-sizing: border-box;
   box-shadow: 1em 1em #dcdcdc;
}

.view-frontpage-content .node--sticky h2 {
   margin-top: .3em;
   padding-top: 0;
}

.view-frontpage-content article.node--sticky h2::before  {
   content: "📌";
}

/* ******************************************************************************* */
/* > VIEWS                                                                         */
/* ******************************************************************************* */

/* Originally started for the timelines, but now seems generic */

/* Originally for Addenda but should work for any view on a sidebar page */
/* Goal is to avoid ugly wraps at date hyphens and with THs */
body.sidebar-second.not-front .field--type-viewsreference td {
    max-width: 80ch;
    word-wrap: break-word;
    hyphens: none;
}


td.views-field {
    vertical-align: top;
}

div.view-filters div.form-actions input[value="Search"] {
    font-weight: bold;
    color: #C70039;
}

/* orphan? */
/* oddly, not bold by default */
#edit-field-pubdate-value-wrapper--2 legend {
    font-weight: bold;
}

/* orphan? *
/* Better Exposed Form dependency, but I need BEF to get the date widget */
.bef-exposed-form .form--inline > .form-item, .bef-exposed-form .form--inline .js-form-wrapper > .form-item {
    float: none;
}

/* ******************************************************************************* */
/* > IMAGE POSITION for ALL CONTENT                                                */
/* ******************************************************************************* */

/* Not controlling width, e.g. to 50% because editorial conventions do that. */

.field-item .pure-img,
.colorbox .pure-img,
.field--type-text-with-summary img
{
  margin: auto;
  /* float: left;  LTR */
  /* margin: 0 1em 1em 0;  LTR */
}

[dir="rtl"] .field-item .pure-img,
[dir="rtl"] .colorbox .pure-img,
.node__content img {
   margin: auto;
/* float: right;
  margin: 0 0 1em 1em; */
}

iframe {
     margin: auto;
     display:block;
}

/* ******************************************************************************* */
/* > SLIDESHOW                                                                     */
/* ******************************************************************************* */

/* I don't think I want this, but are there side effects? */
/* min height on mobiles */
#slider img {
  min-height: 10em;
}

/* ******************************************************************************* */
/* > BORDER FOR NON-THEMED BLOCKS                                                  */
/* ******************************************************************************* */
#sidebar-left .block,
#sidebar-right .block {
  border-top: 1px dotted #333333;
  border-bottom: none;
  border-left: none;
  border-right: none;
  padding-left: 1em;
}

/* agree button */
.agree-button.eu-cookie-compliance-secondary-button {
  cursor: pointer;
  margin: 1em 0 0 1em;
  vertical-align: middle;
  overflow: visible;
  width: auto;
  -moz-box-shadow: inset 0 1px 0 0 #FFFFFF;
  -webkit-box-shadow: inset 0 1px 0 0 #FFFFFF;
  box-shadow: inset 0 1px 0 0 #FFFFFF;
  background-color: #ededed;
  background-image: -moz-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(5%, #ededed), color-stop(100%, #dfdfdf));
  background-image: -webkit-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
  background-image: -o-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
  background-image: -ms-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
  background-image: linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #dcdcdc;
  color: #333333;
  font-family: 'Cabin', sans-serif;
  font-weight: bold;
  padding: 4px 8px;
  text-decoration: none;
  text-shadow: 1px 1px 0 #FFFFFF;
}

/* ******************************************************************************* */
/* > SIDEBARS' BLOCKS ADAPTIVE DISPLAY                                             */
/* ******************************************************************************* */

@media screen and (max-width: 64em) {
  #sidebar-left .block-wrapper,
  #sidebar-right .block-wrapper {
    width: 48%;
    padding: 0 1.5% 0 0;
    display: inline-block;
    vertical-align: bottom;
  }
}

@media screen and (max-width: 48em) {
  #sidebar-left .block-wrapper,
  #sidebar-right .block-wrapper {
    width: 100%;
    padding: 0;
    display: block;
  }
}
