/******************************************************************
Site Name:
Author:

Stylesheet: Variables

Here is where we declare all our variables like colors, fonts,
base values, and defaults. We want to make sure this file ONLY
contains variables that way our files don't get all messy.
No one likes a mess.

******************************************************************/
/*********************
COLORS
Need help w/ choosing your colors? Try this site out:
http://0to255.com/
*********************/
/*
Here's a great tutorial on how to
use color variables properly:
http://sachagreif.com/sass-color-variables/
*/
/******************************************************************
Site Name: 
Author: 

Stylesheet: Typography

******************************************************************/
/*
"Web design is 95% typography" - Oliver Reichenstein

When that quote was made in 2006 it was before web fonts, auto-play video,
and animated pop-ups so even if it is 65 or 75% today that is still *most* 
of any web site's design. Understanding some of the basics of typography
(and web typography) will go a long way.

There are lots of web typographic systems out there however many are
overly complex and not intuitive. Thus, we've tried to set some good
defaults that aren't based on confounding mixins here but you may want
to explore web typography further:

https://www.smashingmagazine.com/2009/08/typographic-design-survey-best-practices-from-the-best-blogs/
https://www.smashingmagazine.com/2012/12/css-baseline-the-good-the-bad-and-the-ugly/
http://www.newnet-soft.com/blog/csstypography
http://typecast.com/blog/4-simple-steps-to-vertical-rhythm
https://github.com/StudioThick/megatype
https://sassline.com
http://matejlatin.github.io/Gutenberg/
https://zellwk.com/blog/responsive-typography/
https://github.com/zellwk/typi

Note that most of the typography styles are set in base.scss with
the html, body, and h1-h6 tags so adjust as needed. Set a good baseline
and consider your vertical rhythm.

*/
/*********************
FONT FACE (IN YOUR FACE)
*********************/
/* To embed your own fonts, use this syntax
  and place your fonts inside the
  library/fonts folder. For more information
  on embedding fonts, go to:
  http://www.fontsquirrel.com/
  Be sure to remove the comment brackets.
  
  Also, you don't have to include a separate name for 
  each font style...just use the same name and
  declare each style separately. See here:
  http://www.newnet-soft.com/blog/csstypography
*/
/*  @font-face {
      font-family: 'Font Name';
      src: url('library/fonts/font-name.eot');
      src: url('library/fonts/font-name.eot?#iefix') format('embedded-opentype'),
             url('library/fonts/font-name.woff') format('woff'),
             url('library/fonts/font-name.ttf') format('truetype'),
             url('library/fonts/font-name.svg#font-name') format('svg');
      font-weight: normal;
      font-style: normal;
  }
*/
/*********************
FONT STACKS
*********************/
/*
 Commented out since WP uses system fonts now but if you can't let go I won't be upset. 
*/
/*
some nice typographical defaults
more here: http://www.newnet-soft.com/blog/csstypography
*/
/* line 89, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/partials/_typography.scss */
p {
  -ms-word-wrap: break-word;
  word-wrap: break-word;
  word-break: break-word;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  hyphens: none;
  -webkit-hyphenate-before: 2;
  -webkit-hyphenate-after: 3;
  hyphenate-lines: 3;
  -webkit-font-feature-settings: "liga", "dlig";
  -moz-font-feature-settings: "liga=1, dlig=1";
  -ms-font-feature-settings: "liga", "dlig";
  -o-font-feature-settings: "liga", "dlig";
  font-feature-settings: "liga", "dlig";
}

/* line 5, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
.block-featured-news h2 {
  margin-top: 2.5rem;
}

/* line 8, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
.block-featured-news #articles-grid {
  padding-top: 2.5rem;
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 1.5rem;
  padding-left: 0rem;
  padding-right: 0rem;
}

/* line 16, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
.block-featured-news #articles-grid .article-item {
  background-color: #CDE8E7;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
}

/* line 23, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
.block-featured-news #articles-grid .article-item .article-thumbnail img {
  width: 100%;
}

/* line 28, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
.block-featured-news #articles-grid .article-item .article-details {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* line 35, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
.block-featured-news #articles-grid .article-item .article-details .article-title {
  font-size: 24px;
  line-height: 28px;
  font-family: "Literata", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-weight: 500;
  color: #23473E;
}

/* line 43, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
.block-featured-news #articles-grid .article-item .article-details .article-summary {
  margin-top: 1rem;
}

/* line 47, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
.block-featured-news #articles-grid .article-item .article-details .outline-btn {
  margin-top: 1rem;
}

/* line 53, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
.block-featured-news .view-more {
  grid-column: span 1;
  padding: 1.5rem 0;
  display: flex;
  justify-content: center;
  align-content: center;
}

@media only screen and (min-width: 768px) {
  /* line 64, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
  .block-featured-news #articles-grid {
    grid-template-columns: 1fr 1fr;
    padding-left: 3rem;
    padding-right: 3rem;
  }
  /* line 69, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
  .block-featured-news .view-more {
    grid-column: span 2;
    padding: 1.5rem 0;
    display: flex;
    justify-content: center;
    align-content: center;
  }
}

@media only screen and (min-width: 1030px) {
  /* line 81, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
  .block-featured-news #articles-grid {
    padding-left: 6rem;
    padding-right: 6rem;
    grid-template-columns: 1fr 1fr 1fr;
  }
  /* line 86, ../../../../MAMP/htdocs/greenheartuk.com/wp-content/themes/greenheart/library/scss/block-featured-news.scss */
  .block-featured-news .view-more {
    grid-column: span 4;
  }
}

/*# sourceMappingURL=block-featured-news.css.map */