@charset "UTF-8";
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0; }

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block; }

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */ }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent; }

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */ }

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder; }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none; }

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible; }

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none; }

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em; }

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */ }

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline; }

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto; }

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */ }

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block; }

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item; }

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none; }

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none; }

@font-face {
  font-family: "Muli";
  src: url("../site/Muli-Regular.ttf") format("truetype"); }
@font-face {
  font-family: "Oswald";
  src: url("../site/Oswald-Regular.ttf") format("truetype"); }
html, body {
  padding: 0;
  margin: 0;
  height: 100%;
  width: 100%; }

body {
  font-family: "Muli", sans-serif;
  overflow-x: hidden;
  font-size: 16px;
  line-height: 1.67em;
  display: flex;
  flex-direction: column; }

main {
  flex: 1 0 auto;
  margin-top: 48px;
  background-color: #eee9e1;
  padding-bottom: 48px;
  overflow-x: hidden;
  max-width: 100vw; }

footer {
  flex-shrink: 0; }

.toppadding {
  height: 24px; }

header h1, header .subtitle {
  text-align: center; }

h1, h2, h3, h4, .subtitle {
  text-transform: uppercase;
  display: block;
  width: 100%;
  font-family: "Oswald", sans-serif;
  font-weight: normal;
  line-height: 1.15em;
  padding: 20px 0 10px 0;
  margin: 0;
  hyphens: none; }

h1 {
  font-size: 3rem; }

h2, .subtitle {
  font-size: 2.2rem; }

h3 {
  font-size: 1.5rem; }

.subtitle {
  padding-bottom: 0.5em; }

h4 {
  font-size: 1.25rem; }

.darklink, a, a:link, a:visited {
  color: #282D34;
  font-weight: bold;
  hyphens: none;
  text-decoration: underline; }

@media screen and (max-width: 600px) {
  body {
    font-size: 16px; }

  h1, .subtitle {
    max-width: 90vw;
    margin: 0 auto; }

  h1 {
    font-size: 2.2rem; }

  h2, .subtitle {
    font-size: 1.5rem; }

  h3, h4 {
    font-size: 1.25rem; } }
.page_content {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
  margin-top: 0; }

.page_heroimg_true {
  margin-top: -1em; }

.center {
  margin: 0 auto; }

.header {
  z-index: 1;
  width: 100%;
  height: 48px;
  background: #282D34;
  color: white;
  position: fixed;
  top: 0;
  margin-left: 0;
  display: flex;
  justify-content: space-between;
  align-items: stretch; }
  @media screen and (min-width: 600px) and (min-height: 450px) {
    .header {
      height: 56px; } }

.logo {
  height: 50px;
  width: auto;
  padding-top: 8px;
  padding-left: 10px; }
  @media screen and (min-width: 600px) and (min-height: 450px) {
    .logo {
      padding-top: 0;
      padding-left: 40px;
      height: 80px; } }

.nav_open {
  display: flex;
  align-items: center;
  padding: 0 6px;
  height: 100%;
  color: #efefed;
  cursor: pointer; }
  .nav_open svg {
    fill: #efefed;
    height: 40px;
    width: 40px; }
  .nav_open .show_lg {
    display: none;
    font-size: 24px;
    padding-right: 10px;
    align-self: center; }
    @media screen and (min-width: 600px) and (min-height: 450px) {
      .nav_open .show_lg {
        display: inline-block; } }

nav > a:hover, .closebtn:hover {
  background-color: #E15A5A;
  color: #282D34;
  cursor: pointer; }

#toggleMe {
  width: 0; }

#toggleControl:checked ~ #toggleMe {
  width: 240px; }

nav {
  color: #efefed;
  position: fixed;
  /* Stay in place */
  top: 0;
  right: 0;
  background-color: #282D34;
  /* Dark */
  overflow-x: hidden;
  /* Disable horizontal scroll */
  padding: 48px 0 20px 0;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  /* 0.5 second transition effect to slide in the sidenav */ }
  nav a, nav a:link, nav a:visited, nav a:hover {
    color: #efefed;
    text-decoration: none;
    line-height: 36px;
    padding: 12px 15px; }
  nav a {
    display: block;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    padding-left: 40px; }
    nav a:hover {
      color: #282D34;
      padding-left: 60px; }
  nav .closebtn {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 34px;
    line-height: 1.5;
    width: 48px;
    height: 48px;
    text-align: center; }

.blogpost_heroimg {
  margin-left: 50%;
  transform: translateX(-50%);
  z-index: 0;
  height: 300px; }
  @media screen and (min-width: 800px) {
    .blogpost_heroimg {
      height: auto; } }

.blogpost_content, .page_content, .consent_form {
  margin: 32px auto 0;
  width: calc(100% - 32px);
  padding: 1px 16px 30px;
  max-width: 720px;
  color: #1f0909;
  hyphens: auto; }
  @media screen and (min-width: 460px) {
    .blogpost_content, .page_content, .consent_form {
      width: calc(100% - 64px);
      padding: 1px 32px 30px; } }
  @media screen and (min-width: 800px) {
    .blogpost_content, .page_content, .consent_form {
      padding: 1px 52px 30px; } }
  .blogpost_content .intro, .page_content .intro, .consent_form .intro {
    font-size: 1.1em; }
  .blogpost_content a, .page_content a, .consent_form a, .blogpost_content a:link, .page_content a:link, .consent_form a:link, .blogpost_content a:visited, .page_content a:visited, .consent_form a:visited, .blogpost_content a:hover, .page_content a:hover, .consent_form a:hover {
    color: #4696C9;
    font-weight: normal; }
  .blogpost_content ul, .page_content ul, .consent_form ul {
    max-width: 80%; }

.blogpost_content_lightbg, .page_content, .consent_form {
  background-color: #fffdfa; }
  @media screen and (min-width: 800px) {
    .blogpost_content_lightbg, .page_content, .consent_form {
      border-radius: 15px;
      box-shadow: 6px 8px rgba(174, 178, 178, 0.6); } }

.post_metadata, .post_preview_metadata {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
  font-size: 0.875rem; }
  .post_metadata .post_metadata_block, .post_preview_metadata .post_metadata_block {
    margin: 0 5px;
    display: flex;
    align-items: center; }
    .post_metadata .post_metadata_block svg, .post_preview_metadata .post_metadata_block svg {
      stroke-width: 0;
      fill: #282D34;
      height: 18px;
      width: 18px;
      padding-right: 4px; }

.consent_form {
  max-width: 620px;
  display: flex;
  flex-flow: column;
  margin-top: 20px; }
  .consent_form button {
    background-color: #4696C9;
    color: #fffdfa;
    padding: 8px 20px;
    align-self: center;
    font-size: 17px;
    cursor: pointer;
    border: none; }

#disqus_thread {
  background: #fffdfa;
  border-radius: 15px;
  padding: 32px; }

.share_post {
  text-align: center;
  padding-top: 20px;
  padding-bottom: 10px; }
  .share_post a {
    width: auto; }

.resp-sharing-button__link,
.resp-sharing-button__icon {
  display: inline-block; }

.resp-sharing-button__link {
  text-decoration: none;
  color: #fff;
  margin: 0 4px 8px 4px;
  font-size: 17px; }

.resp-sharing-button {
  border-radius: 5px;
  transition: 25ms ease-out;
  padding: 0 8px 3px 8px; }

.resp-sharing-button__icon svg {
  width: 18px;
  height: 18px;
  vertical-align: top; }

.resp-sharing-button--small svg {
  margin: 0;
  vertical-align: middle; }

/* Non solid icons get a stroke */
.resp-sharing-button__icon {
  stroke: #fff;
  fill: none; }

/* Solid icons get a fill */
.resp-sharing-button__icon--solid,
.resp-sharing-button__icon--solidcircle {
  fill: #fff;
  stroke: none; }

.resp-sharing-button--facebook {
  background-color: #555C5C; }

.resp-sharing-button--facebook:hover,
.resp-sharing-button--facebook:active {
  background-color: #2d4373; }

.resp-sharing-button--twitter {
  background-color: #555C5C; }

.resp-sharing-button--twitter:hover,
.resp-sharing-button--twitter:active {
  background-color: #2795e9; }

.resp-sharing-button--google {
  background-color: #555C5C; }

.resp-sharing-button--google:hover,
.resp-sharing-button--google:active {
  background-color: #c23321; }

.resp-sharing-button--email {
  background-color: #555C5C; }

.resp-sharing-button--email:hover,
.resp-sharing-button--email:active {
  background-color: #d35400; }

.resp-sharing-button--linkedin {
  background-color: #555C5C; }

.resp-sharing-button--linkedin:hover,
.resp-sharing-button--linkedin:active {
  background-color: #046293; }

.blog_nextpost {
  width: 100%;
  max-width: 800px;
  margin: 32px auto 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between; }
  .blog_nextpost .snippet {
    background-color: #fffdfa; }
    .blog_nextpost .snippet a, .blog_nextpost .snippet a:link, .blog_nextpost .snippet a:visited, .blog_nextpost .snippet a:hover {
      text-decoration: none;
      font-weight: normal;
      color: #282D34; }
  @media screen and (min-width: 640px) {
    .blog_nextpost {
      flex-direction: row; }
      .blog_nextpost .snippet {
        margin: 10px; } }

footer {
  background-color: #282D34;
  height: 200px;
  color: #efefed;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  text-align: center; }
  footer a, footer a:hover, footer a:visited, footer a:link {
    color: #efefed;
    font-weight: bold; }

blockquote {
  border-left: 12px solid #E15A5A;
  padding: 0.5em 1em;
  margin: 2.5em 1em 1.5em 1em;
  display: flex;
  flex-direction: column;
  background-color: #EFEFEF;
  border-radius: 1em;
  font-size: 16px; }
  blockquote cite {
    font-style: normal;
    font-size: 0.8em; }
  blockquote p {
    margin: 0.5em 0 0.5em 0.5em; }

blockquote:before {
  color: #555C5C;
  content: '“';
  font-size: 8em;
  line-height: 0.1em;
  margin-bottom: -16px;
  padding-top: 22px; }

blockquote.left {
  float: left; }
  @media screen and (min-width: 640px) {
    blockquote.left {
      margin: 1em 1.5em 1em 0; } }

blockquote.right {
  float: right; }
  @media screen and (min-width: 640px) {
    blockquote.right {
      margin: 1em 0 1em 1.5em; } }

@media screen and (min-width: 640px) {
  blockquote.right, blockquote.left {
    width: 40%;
    border-radius: 10px;
    border-left-width: 8px; }
    blockquote.right:before, blockquote.left:before {
      font-size: 6em;
      padding-top: 14px;
      margin-bottom: -10px; } }

figure {
  margin: 0; }
  figure img {
    width: auto;
    max-width: 100%; }
  figure figcaption {
    font-style: italic;
    color: #555C5C;
    padding: 0 20px; }

.imgleft, .imgright {
  width: 100vw;
  text-align: center; }
  @media screen and (max-width: 639px) {
    .imgleft, .imgright {
      margin-left: 50%;
      transform: translateX(-50%); } }

.imgcenter {
  max-width: 100%;
  margin: 10px auto;
  text-align: center; }
  .imgcenter img {
    max-width: 100%; }

@media screen and (min-width: 640px) {
  .imgleft, .imgright {
    max-width: 50%;
    margin: 14px 20px; }

  .imgleft {
    float: left;
    padding-left: 0;
    margin-left: 0; }

  .imgright {
    float: right;
    padding-right: 0;
    margin-right: 0; } }
.imgwide {
  max-width: 960px;
  width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
  padding: 10px 0;
  text-align: center; }
  .imgwide figcaption {
    width: 720px;
    max-width: 80%;
    margin: 0 auto; }

.author_container {
  width: 120px;
  margin: 10px 0 0 20px;
  float: right;
  display: flex;
  flex-flow: row wrap;
  justify-content: center; }
  @media screen and (min-width: 600px) {
    .author_container {
      max-width: 260px;
      width: auto; }
      .author_container .authorimg:nth-child(even) {
        padding-left: 20px; } }
  @media screen and (max-width: 460px) {
    .author_container {
      width: 100%; }
      .author_container .authorimg:nth-child(even) {
        padding-left: 10px; } }

.authorimg {
  width: 120px;
  font-size: 0.875rem;
  line-height: 1.67em;
  padding-bottom: 10px;
  display: flex;
  align-items: center;
  flex-flow: column;
  text-align: center; }
  .authorimg img {
    width: 100%;
    border-radius: 10px;
    -webkit-filter: grayscale(100%);
    /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    padding-bottom: 4px; }
  .authorimg .authorname {
    font-weight: bold; }

.subscribeform_mid {
  margin: 32px auto 0; }

.page_email {
  display: flex;
  flex-direction: column;
  width: 80%;
  max-width: 600px;
  margin: 0 auto;
  padding: 0 0 16px 0;
  border-radius: 15px; }
  .page_email input, .page_email textarea, .page_email button {
    min-height: 20px;
    margin: 5px;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid #AEB2B2; }
  .page_email button {
    border: 0;
    width: 140px;
    cursor: pointer; }
    .page_email button:hover {
      background-color: #E15A5A;
      transition: 0.25s; }

pre, code {
  background: #efefed; }

code {
  padding: 0 3px; }

pre {
  padding: 10px 20px;
  white-space: pre-wrap;
  /* css-3 */
  white-space: -moz-pre-wrap;
  /* Mozilla, since 1999 */
  white-space: -pre-wrap;
  /* Opera 4-6 */
  white-space: -o-pre-wrap;
  /* Opera 7 */
  word-wrap: break-word;
  /* Internet Explorer 5.5+ */ }

.blog_overview {
  display: grid;
  grid-template-columns: 2;
  grid-gap: 30px 20px;
  max-width: 960px;
  margin: 0 auto 30px;
  padding: 10px; }
  .blog_overview article:first-child {
    grid-column: span 2; }
    .blog_overview article:first-child .post_preview_text h2 {
      font-size: 1.8em; }
  .blog_overview article:nth-child(4) {
    grid-column: span 2; }
    .blog_overview article:nth-child(4) .post_preview_text h2 {
      font-size: 1.8em; }
  @media screen and (max-width: 640px) {
    .blog_overview article {
      grid-column: span 2; } }

.post_preview {
  border-radius: 0px;
  background: #fffdfa;
  position: relative;
  overflow: hidden;
  border: 1px solid #282D34; }
  .post_preview figure {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: auto; }
    @media screen and (max-width: 640px) {
      .post_preview figure {
        height: 250px; }
        .post_preview figure img {
          height: 100%;
          width: auto;
          max-width: none;
          margin-left: 50%;
          transform: translateX(-50%); } }
  .post_preview img {
    height: auto; }

.post_preview_text {
  padding: 10px 24px; }
  .post_preview_text a, .post_preview_text a:link, .post_preview_text a:visited, .post_preview_text a:hover {
    text-decoration: none; }
  .post_preview_text h2, .post_preview_text .subtitle {
    text-align: left; }
  .post_preview_text h2 {
    padding-top: 0;
    font-size: 1.6em; }
    @media screen and (max-width: 600px) {
      .post_preview_text h2 {
        font-size: 1.5rem; } }
    .post_preview_text h2 a, .post_preview_text h2 a:link, .post_preview_text h2 a:visited, .post_preview_text h2 a:hover {
      font-weight: normal; }
  .post_preview_text .subtitle {
    font-size: 1.4em;
    padding: 0; }
    @media screen and (max-width: 600px) {
      .post_preview_text .subtitle {
        font-size: 1.25rem; } }
  .post_preview_text p {
    hyphens: auto; }

.pagination {
  margin: 0 auto;
  max-width: 320px;
  display: flex;
  justify-content: center; }
  .pagination a, .pagination .currpage {
    padding: 0 10px; }

.post_preview_metadata {
  justify-content: flex-start;
  margin-top: 16px; }

.page_collection {
  margin: 32px auto 0 auto;
  width: 100%;
  max-width: 500px; }
  .page_collection img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 6px 8px rgba(174, 178, 178, 0.6); }

.tabbed_gallery {
  width: 100%;
  position: relative;
  clear: both;
  margin: 25px 0;
  border-radius: 15px;
  overflow-x: hidden; }

.tabbed_gallery_labels {
  overflow: hidden;
  border-bottom: 1px solid #ccc;
  background-color: #f1f1f1; }
  .tabbed_gallery_labels button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s; }
  .tabbed_gallery_labels button:hover {
    background-color: #ddd; }
  .tabbed_gallery_labels button.active {
    background-color: #ccc; }

.tabbed_gallery_title {
  background: #282D34;
  text-align: center;
  color: #efefed; }
  .tabbed_gallery_title h3 {
    padding: 10px 0; }

.tabbed_gallery_tab {
  display: none;
  padding: 6px 12px;
  border-top: none;
  min-height: 150px;
  background-color: #EFEFEF; }

.tabbed_gallery_imgtitle {
  text-align: left;
  font-size: 24px;
  padding-top: 10px;
  padding-bottom: 0px; }

.tabbed_gallery_image {
  max-width: 100%;
  margin: 0 auto; }
  @media screen and (min-width: 600px) {
    .tabbed_gallery_image {
      max-width: 300px;
      margin: auto;
      float: left;
      padding: 10px 20px 10px 0; } }

.icard_toggle {
  padding: 0 2px; }
  .icard_toggle svg {
    width: auto;
    margin-bottom: -2px; }

.icard_toggle:hover {
  color: #E15A5A;
  cursor: pointer; }

.icard_content {
  display: none;
  background: #EFEFEF;
  margin: 1em;
  padding: 16px;
  color: black;
  border-radius: 10px; }

@media screen and (min-width: 500px) {
  .icard_content {
    margin: 1em 3em;
    padding: 24px 36px; } }
.snippet {
  width: 100%;
  max-width: 340px;
  margin: 20px auto;
  overflow: hidden;
  border-radius: 15px;
  background-color: #EFEFEF;
  position: relative; }
  .snippet a, .snippet a:link, .snippet a:hover, .snippet a:visited {
    text-decoration: none; }
  .snippet .snippet-title {
    background: rgba(40, 45, 52, 0.8);
    color: #fffdfa;
    padding: 8px;
    text-align: center; }
  .snippet .toppadding {
    height: 42px; }
  .snippet .snippet-inner {
    padding: 0 20px; }
    .snippet .snippet-inner:last-child {
      margin-bottom: 20px; }
    .snippet .snippet-inner .title {
      display: block;
      margin: 10px 0;
      font-size: 1.25rem;
      font-family: "Oswald", sans-serif; }
    .snippet .snippet-inner p {
      font-size: 0.875rem;
      line-height: 1.5em;
      margin: 0;
      hyphens: auto; }
  .snippet figure {
    max-height: 200px;
    width: 100%;
    overflow: hidden; }

.snippet-inner > a, .snippet-inner > a:link, .snippet-inner > a:visited, .snippet-inner > a:hover {
  color: #282D34;
  text-decoration: none;
  font-weight: normal; }
.snippet-inner > p > a, .snippet-inner > p > a:link, .snippet-inner > p > a:visited, .snippet-inner > p > a:hover {
  color: #282D34;
  text-decoration: none;
  font-weight: bold; }