@import url("https://fonts.googleapis.com/css2?family=Caveat+Brush&family=Henny+Penny&family=PT+Serif:wght@400;700&family=Poppins:wght@400;700&family=Sanchez&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Caveat+Brush&family=Henny+Penny&family=PT+Serif:wght@400;700&family=Poppins:wght@400;700&family=Sanchez&display=swap");
body {
  font-family: "PT Serif", serif;
  line-height: 1.5rem;
  display: grid; }
  body a {
    color: black;
    text-decoration: none; }
  @media screen {
    body {
      padding: 0 1rem 0 1rem;
      grid-template-areas: "header" "content" "footer";
      grid-template-rows: 8rem 1fr auto; } }
  @media screen and (min-width: 720px) {
    body {
      padding: 1rem 2rem 1rem 2rem;
      grid-template-rows: 8rem auto 4rem; } }
  @media screen and (min-width: 960px) {
    body {
      padding: 1rem 3rem 1rem 3rem;
      grid-template-rows: 12rem auto 4rem; } }
  @media screen and (min-width: 1440px) {
    body {
      padding: 1rem 6rem 1rem 6rem;
      grid-template-rows: 12rem auto 4rem; } }
  @media print {
    body {
      border: 0; }
      body header, body footer {
        display: none; }
      body main {
        font-size: 40px;
        text-align: center;
        border: 0; } }
  body header {
    display: grid;
    grid-area: header;
    grid-template-columns: 1fr;
    grid-template-areas: 'stack';
    justify-items: center; }
    @media screen {
      body header {
        max-height: 8rem; } }
    @media screen and (min-width: 720px) {
      body header {
        max-height: 8rem; } }
    @media screen and (min-width: 960px) {
      body header {
        max-height: 12rem; } }
    @media screen and (min-width: 1440px) {
      body header {
        max-height: 12rem; } }
    body header a {
      color: black; }
      body header a img.logo {
        grid-area: stack; }
        @media screen {
          body header a img.logo {
            max-height: 6rem; } }
        @media screen and (min-width: 540px) {
          body header a img.logo {
            max-height: 6rem; } }
        @media screen and (min-width: 720px) {
          body header a img.logo {
            max-height: 5.2rem; } }
        @media screen and (min-width: 960px) {
          body header a img.logo {
            max-height: 9.2rem; } }
        @media screen and (min-width: 1440px) {
          body header a img.logo {
            max-height: 9rem; } }
      body header a div.tagline {
        grid-area: stack;
        grid-area: stack;
        font-family: "Caveat Brush", serif;
        line-height: 1;
        opacity: 80%; }
        @media screen {
          body header a div.tagline {
            font-size: 1.6rem; } }
        @media screen and (min-width: 720px) {
          body header a div.tagline {
            font-size: 2rem; } }
        @media screen and (min-width: 720px) {
          body header a div.tagline {
            font-size: 2.8rem; } }
        @media screen and (min-width: 960px) {
          body header a div.tagline {
            font-size: 2.8rem; } }
        @media screen and (min-width: 1440px) {
          body header a div.tagline {
            font-size: 3rem; } }
  body main {
    grid-area: content;
    margin-bottom: 2rem; }
    body main h1 {
      margin-top: 1.5rem;
      padding-top: 1.5rem;
      padding-bottom: 2rem;
      border-top: 1px solid grey;
      font-family: "PT Serif", serif;
      font-size: 2.5rem;
      font-weight: 500;
      letter-spacing: 0.025rem; }
    body main .cards {
      display: grid;
      grid-template-columns: repeat(1, minmax(0, 1fr));
      row-gap: 1rem; }
      @media screen and (min-width: 720px) {
        body main .cards {
          grid-template-columns: repeat(2, minmax(0, 1fr));
          column-gap: 2rem;
          row-gap: 2rem; } }
      @media screen and (min-width: 960px) {
        body main .cards {
          grid-template-columns: repeat(3, minmax(0, 1fr));
          column-gap: 3rem;
          row-gap: 2rem; } }
      @media screen and (min-width: 1440px) {
        body main .cards {
          grid-template-columns: repeat(4, minmax(0, 1fr));
          column-gap: 4rem;
          row-gap: 2rem; } }
      body main .cards .card {
        border-top: 1px solid grey;
        padding-top: 1rem; }
        body main .cards .card a {
          color: black;
          letter-spacing: 0.025rem;
          font-family: "PT Serif", serif;
          line-height: 150%; }
          body main .cards .card a .card-date {
            font-family: "Poppins", sans-serif;
            font-size: 90%;
            opacity: 60%;
            text-transform: uppercase; }
          body main .cards .card a .card-title {
            font-weight: bold;
            font-size: 135%;
            padding: 0 0 2.5rem 0;
            max-height: 2rem;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap; }
          body main .cards .card a img {
            border-radius: 1rem; }
          body main .cards .card a .card-body {
            color: black;
            font-weight: normal;
            font-size: 110%;
            line-height: 150%;
            margin-top: 1rem;
            text-align: left;
            padding: 0; }
            body main .cards .card a .card-body .read-more {
              margin-top: 1rem; }
    body main .link-all-trips {
      padding-top: 2em; }
      body main .link-all-trips a {
        font-size: 120%; }
    body main .post {
      font-weight: normal;
      line-height: 175%;
      font-size: 110%;
      margin-top: 1rem;
      text-align: left;
      padding: 0;
      margin: auto; }
      @media screen {
        body main .post {
          width: 100%; } }
      @media screen and (min-width: 720px) {
        body main .post {
          width: 85%; } }
      @media screen and (min-width: 960px) {
        body main .post {
          width: 70%; } }
      @media screen and (min-width: 1440px) {
        body main .post {
          width: 70%; } }
      body main .post .next-prev-page-links {
        display: flex;
        flex-direction: row;
        border-top: 1px solid grey;
        margin-top: 1.5rem;
        padding-top: 1rem; }
        body main .post .next-prev-page-links div a {
          font-family: "Poppins", sans-serif;
          font-size: 0.9rem;
          letter-spacing: 0.025em;
          opacity: 80%;
          text-transform: none; }
        body main .post .next-prev-page-links div:nth-of-type(1) {
          text-align: left;
          width: 50%; }
        body main .post .next-prev-page-links div:nth-of-type(2) {
          text-align: right;
          width: 50%; }
      body main .post h1 {
        border-top: none;
        padding: 0;
        margin-top: 1rem;
        font-size: 2rem;
        letter-spacing: 0.025rem; }
      body main .post h2 {
        font-family: "PT Serif", serif;
        font-size: 150%;
        padding-top: 1.5rem;
        font-weight: bold;
        letter-spacing: 0.025rem;
        margin: 0.5rem 0 0.5rem 0; }
      body main .post .post-date {
        font-family: "Poppins", sans-serif;
        font-size: 90%;
        padding-top: 0.25rem;
        opacity: 60%;
        text-transform: uppercase; }
      body main .post .post-content p {
        padding-top: 0.5em;
        padding-bottom: 0em; }
      body main .post .post-content img {
        padding-top: 0.5em;
        padding-bottom: 0em; }
      body main .post .post-content figcaption {
        opacity: 80%;
        text-align: center;
        font-style: italic;
        font-size: 90%;
        letter-spacing: 0.05em;
        width: 100%;
        padding-bottom: 0.25em; }
      body main .post a.back-to-top-link {
        display: block;
        opacity: 80%;
        padding-top: 1rem; }
  body footer {
    grid-area: footer;
    display: flex;
    border-top: 1px solid grey;
    padding-top: 1rem;
    font-family: "Poppins", sans-serif;
    letter-spacing: 0.1em;
    font-weight: bold;
    font-size: 90%;
    justify-content: center; }