
/* Headers via https://patorjk.com/software/taag/#p=display&f=Doh */



/*

    ffffffffffffffff                                           tttt
   f::::::::::::::::f                                       ttt:::t
  f::::::::::::::::::f                                      t:::::t
  f::::::fffffff:::::f                                      t:::::t
  f:::::f       ffffffooooooooooo   nnnn  nnnnnnnn    ttttttt:::::ttttttt        ssssssssss
  f:::::f           oo:::::::::::oo n:::nn::::::::nn  t:::::::::::::::::t      ss::::::::::s
 f:::::::ffffff    o:::::::::::::::on::::::::::::::nn t:::::::::::::::::t    ss:::::::::::::s
 f::::::::::::f    o:::::ooooo:::::onn:::::::::::::::ntttttt:::::::tttttt    s::::::ssss:::::s
 f::::::::::::f    o::::o     o::::o  n:::::nnnn:::::n      t:::::t           s:::::s  ssssss
 f:::::::ffffff    o::::o     o::::o  n::::n    n::::n      t:::::t             s::::::s
  f:::::f          o::::o     o::::o  n::::n    n::::n      t:::::t                s::::::s
  f:::::f          o::::o     o::::o  n::::n    n::::n      t:::::t    ttttttssssss   s:::::s
 f:::::::f         o:::::ooooo:::::o  n::::n    n::::n      t::::::tttt:::::ts:::::ssss::::::s
 f:::::::f         o:::::::::::::::o  n::::n    n::::n      tt::::::::::::::ts::::::::::::::s
 f:::::::f          oo:::::::::::oo   n::::n    n::::n        tt:::::::::::tt s:::::::::::ss
 fffffffff            ooooooooooo     nnnnnn    nnnnnn          ttttttttttt    sssssssssss

Fonts

*/




/* Duplicate as needed */
@font-face {
    font-family: 'HeldaneText-Regular';
    src: url("../fonts/HeldaneText-Regular.woff2") format("woff2"),
         url("../fonts/HeldaneText-Regular.woff") format("woff");

  }


@font-face {
    font-family: 'HeldaneText-RegularItalic';
    src: url("../fonts/HeldaneText-RegularItalic.woff2") format("woff2"),
    url("../fonts/HeldaneText-RegularItalic.woff") format("woff");

}

@font-face {
    font-family: 'HeldaneText-Medium';
    src: url("../fonts/HeldaneText-Medium.woff2") format("woff2");
}


@font-face {
    font-family: 'FoundersGrotesk-Light';
    src: url("../fonts/FoundersGrotesk-Light.woff2") format("woff2"),
    url("../fonts/FoundersGrotesk-Light.woff") format("woff");

}

:root {
    font-size: 100%;
    font-family: sans-serif;
    --font-family-serif: "HeldaneText-Regular";
    --font-family-serif-italic: "HeldaneText-RegularItalic";
    --font-family-serif-medium: "HeldaneText-Medium";
    --font-family-sans-serif: "FoundersGrotesk-Light";
}




* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
    font-size: 1.25rem;
	line-height: 2rem;


}




.sans-serif{
    font-family: var(--font-family-sans-serif);
}

.serif {
	font-family: var(--font-family-serif);
}

.italic,
.italic p,
.italic a{
    font-family: var(--font-family-serif-italic);
}

html {
    font-size: 100%;
	font-family: var(--font-family-serif);
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
    font-size: 100%;
}


/*



UUUUUUUU     UUUUUUUU        tttt            iiii  lllllll   iiii          tttt
U::::::U     U::::::U     ttt:::t           i::::i l:::::l  i::::i      ttt:::t
U::::::U     U::::::U     t:::::t            iiii  l:::::l   iiii       t:::::t
UU:::::U     U:::::UU     t:::::t                  l:::::l              t:::::t
 U:::::U     U:::::Uttttttt:::::ttttttt    iiiiiii  l::::l iiiiiiittttttt:::::tttttttyyyyyyy           yyyyyyy
 U:::::D     D:::::Ut:::::::::::::::::t    i:::::i  l::::l i:::::it:::::::::::::::::t y:::::y         y:::::y
 U:::::D     D:::::Ut:::::::::::::::::t     i::::i  l::::l  i::::it:::::::::::::::::t  y:::::y       y:::::y
 U:::::D     D:::::Utttttt:::::::tttttt     i::::i  l::::l  i::::itttttt:::::::tttttt   y:::::y     y:::::y
 U:::::D     D:::::U      t:::::t           i::::i  l::::l  i::::i      t:::::t          y:::::y   y:::::y
 U:::::D     D:::::U      t:::::t           i::::i  l::::l  i::::i      t:::::t           y:::::y y:::::y
 U:::::D     D:::::U      t:::::t           i::::i  l::::l  i::::i      t:::::t            y:::::y:::::y
 U::::::U   U::::::U      t:::::t    tttttt i::::i  l::::l  i::::i      t:::::t    tttttt   y:::::::::y
 U:::::::UUU:::::::U      t::::::tttt:::::ti::::::il::::::li::::::i     t::::::tttt:::::t    y:::::::y
  UU:::::::::::::UU       tt::::::::::::::ti::::::il::::::li::::::i     tt::::::::::::::t     y:::::y
    UU:::::::::UU           tt:::::::::::tti::::::il::::::li::::::i       tt:::::::::::tt    y:::::y
      UUUUUUUUU               ttttttttttt  iiiiiiiilllllllliiiiiiii         ttttttttttt     y:::::y
                                                                                           y:::::y
                                                                                          y:::::y
                                                                                         y:::::y
                                                                                        y:::::y
                                                                                       yyyyyyy

   */

/* typography utility styles*/

.border-bottom{
    border-bottom: 1px solid;
    line-height: inherit;
}

.border-bottom:hover{
    border-bottom: 1px solid transparent !important;
    line-height: inherit;
}


.border-bottom-transparent{
    border-bottom: 1px transparent !important;
}

.no-underline, .no-underline a{
	text-decoration:none !important;
}

.underline a:hover{
    border-bottom: 1px solid transparent;
    line-height: inherit;
}


.no-underline:hover{
	text-decoration:none;
}

.all-caps{
    text-transform: uppercase;
}

.capitalize{
    text-transform: capitalize;
}

.text-justify {
    text-align: justify !important;
}

.text-align-center{
    text-align:center;
}

.text-wrap {
    white-space: normal !important;
}

.text-nowrap {
    white-space: nowrap !important;
}

.text-truncate {
	overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-center {
    text-align: center !important;
}

.font-size-200 {
	font-size: 200% !important;
}

.font-size-150 {
	font-size: 150% !important;
}

.font-size-120 {
	font-size: 120% !important;
}

.line-height-100{
line-height:100% !important;
}

.line-height-1,
.line-height-1 * {
    line-height: 1 !important;
}

.decoration-none,
.decoration-none * {
    text-decoration: none;
}




/*




                          tttt                              lllllll
                       ttt:::t                              l:::::l
                       t:::::t                              l:::::l
                       t:::::t                              l:::::l
    ssssssssss   ttttttt:::::tttttttyyyyyyy           yyyyyyyl::::l     eeeeeeeeeeee        ssssssssss
  ss::::::::::s  t:::::::::::::::::t y:::::y         y:::::y l::::l   ee::::::::::::ee    ss::::::::::s
ss:::::::::::::s t:::::::::::::::::t  y:::::y       y:::::y  l::::l  e::::::eeeee:::::eess:::::::::::::s
s::::::ssss:::::stttttt:::::::tttttt   y:::::y     y:::::y   l::::l e::::::e     e:::::es::::::ssss:::::s
 s:::::s  ssssss       t:::::t          y:::::y   y:::::y    l::::l e:::::::eeeee::::::e s:::::s  ssssss
   s::::::s            t:::::t           y:::::y y:::::y     l::::l e:::::::::::::::::e    s::::::s
      s::::::s         t:::::t            y:::::y:::::y      l::::l e::::::eeeeeeeeeee        s::::::s
ssssss   s:::::s       t:::::t    tttttt   y:::::::::y       l::::l e:::::::e           ssssss   s:::::s
s:::::ssss::::::s      t::::::tttt:::::t    y:::::::y       l::::::le::::::::e          s:::::ssss::::::s
s::::::::::::::s       tt::::::::::::::t     y:::::y        l::::::l e::::::::eeeeeeee  s::::::::::::::s
 s:::::::::::ss          tt:::::::::::tt    y:::::y         l::::::l  ee:::::::::::::e   s:::::::::::ss
  sssssssssss              ttttttttttt     y:::::y          llllllll    eeeeeeeeeeeeee    sssssssssss
                                          y:::::y
                                         y:::::y
                                        y:::::y
                                       y:::::y
                                      yyyyyyy



Headers, etc.

*/


h1,
h1 * ,
 .editor-post-title .editor-post-title__input {
    font-family: var(--font-family-sans-serif);
    font-size: 4rem;
    color: var(--jfi-red);
    font-weight: normal;
    line-height:101%;
    text-decoration:none !important;
}

h2,
h2 * {
    font-family: var(--font-family-sans-serif);
    font-size: 2.75rem;
    color: var(--jfi-red);
    font-weight: normal;

}

h3,
h3 * {
    font-family: var(--font-family-sans-serif);
    font-size: 1.5rem;
    font-weight: normal;
    line-height:normal;
}

h4,
h4 *
 {
    font-family: var(--font-family-serif);
    font-size: 1.25rem;
    color: var(--jfi-blue);
    font-weight: normal;
    line-height:140%;
    margin: 0 0 1rem 0;
}

/* longform post single page subtitles ONLY */
h5,
h5 * {
    font-family: var(--font-family-sans-serif);
    font-size: 1.5rem;
    color: var(--jfi-red);
    font-weight: normal;
    line-height:140%;
    margin: 0 0 1rem 0;
}

.further-reading-popup h5 {
    line-height: 100%;
}

h6 {
    font-family: var(--font-family-serif);
    font-size: 1rem;
}


body, p, p a {
	font-family: var(--font-family-serif);
	font-weight: 500;
	text-align: left;
	margin: 0 0 1rem;
    line-height: 1.9rem;
}

small,
small * {
    font-size: 1rem !important;
}


/*links and special styles*/

blockquote{
    border-left: 1px solid;
    padding-left: var(--spacer);
    margin-left: 0.5rem;
    margin-top: calc(2*var(--spacer));
    margin-bottom: calc(2*var(--spacer));
}


p a , li a, div.pinboard a{
    border-bottom: 1px solid;
    color: inherit;
    text-decoration: none !important;
    line-height: inherit;
}

p a:hover , li a:hover, div.pinboard a:hover{
    border-bottom: none;
}

a.author-name-search, a.tag-search {
    border-bottom: 1px solid;
    color: inherit;
    text-decoration: none !important;
    line-height: inherit;
}

a.author-name-search:hover, a.tag-search:hover {
    border-bottom: 1px solid transparent;
}

a.see-all-button {
    border-bottom: 1px solid;
    color: inherit;
    text-decoration: none !important;
    line-height: inherit;
    font-size: 1.75rem;
}

a.see-all-button:hover {
    border-bottom: 1px solid transparent;
}

h4.section-header {
  font-size: 1.5rem !important;
  font-family: var(--font-family-sans-serif);
}

span.results-badge {
  font-size: 1.5rem;
  font-family: var(--font-family-sans-serif);
}

p.tighten, .tighten p{
    line-height:1.9rem;
}


@media screen and (max-width: 991px) {

    * {
        font-size: 1rem;
        line-height: 1.5rem;
    }

    body, p, p * {
        font-size: 1rem;
        line-height: 1.5rem;
    }

    p.tighten, .tighten p{
        line-height:1.5rem;
    }

    h1,
    h1 *{
        font-size: 2.1875rem !important;
        line-height:2.1rem !important;
    }

    h2,
    h2 *{
        font-size: 2.1875rem !important;
        line-height:2.1rem !important;
    }

    h3,
    h3 * {
            font-size: 1.25rem !important;
            line-height:1.75rem !important;
    }

    h4,
    h4 * {
        font-size: 1rem !important;
    }

}

span.sans.blue {
    color: var(--jfi-blue);
}

.search-button {
    color: var(--white);
    background-color: var(--jfi-blue);
    cursor: pointer;
}
