@charset "UTF-8";
/* ********************global********************* */
:root {
  --green-jungle: rgb(11, 53, 44);
  --green-palm: rgb(65, 90, 84);
  --green-palm2: rgb(74, 125, 31);
  --green-palm3: #859A96;
  --green-jungle-darker:#092A23;
  --green-jungle-darkest: #061B16;
  --sand-light: rgb(239, 236, 231);
  --sand-lighter: rgb(242,240,238);
  --sand-medium: rgb(226, 221, 213);
  --sand-dark: rgb(204, 197, 186);
  --white: rgb(255, 255, 255);
  --warmsand: rgb(232, 222, 194);
  --gold-darkest: rgb(146, 98, 28);
  --gold: rgb(165,124,65);
  --gold-bright: rgb(190,160,113);
  --gold-other: #ebbfa2;
  --teracotta: rgb(171,72,47);
  --primary-color-dark: var(--sand-dark);
  --primary-color-medium: var(--sand-medium);
  --primary-color-light: var(--sand-light);
  --primary-color-lighter: var(--sand-lighter);
  --secondary-color-dark: var(--green-jungle);
  --secondary-color-medium: var(--green-palm);
  --secondary-color-light: var(--green-palm2);
  --tertiary-color-dark: var(--gold);
  --tertiary-color-medium: var(--gold-bright);
  --tertiary-color-light: var(--gold-other);
}

[data-theme=dark], .dark-theme {
  --primary-color-dark: var(--green-palm2);
  --primary-color-medium: var(--green-palm);
  --primary-color-light: var(--green-jungle);
  --primary-color-lighter: var(--green-palm3);
  --secondary-color-dark: var(--sand-dark);
  --secondary-color-medium: var(--sand-medium);
  --secondary-color-light: var(--sand-light);
}
[data-theme=dark] table th, [data-theme=dark] table td, [data-theme=dark] table a, .dark-theme table th, .dark-theme table td, .dark-theme table a {
  background-color: var(--green-jungle-darker);
  color: var(--sand-light) !important;
}
[data-theme=dark] table tr, .dark-theme table tr {
  border-bottom: 1px solid var(--primary-color-medium);
}
[data-theme=dark] table tr:last-of-type, .dark-theme table tr:last-of-type {
  border-bottom: 0px;
}
[data-theme=dark] .about-select, [data-theme=dark] .book-retailers, .dark-theme .about-select, .dark-theme .book-retailers {
  background-color: var(--green-jungle-darker);
}
[data-theme=dark] .about-select h2, [data-theme=dark] .about-select .caption, [data-theme=dark] .book-retailers h2, [data-theme=dark] .book-retailers .caption, .dark-theme .about-select h2, .dark-theme .about-select .caption, .dark-theme .book-retailers h2, .dark-theme .book-retailers .caption {
  color: var(--sand-lighter);
}
[data-theme=dark] nav ul, .dark-theme nav ul {
  background-color: var(--sand-light);
}
[data-theme=dark] nav ul a, .dark-theme nav ul a {
  color: var(--green-jungle-darkest);
}
[data-theme=dark] nav ul a:hover, .dark-theme nav ul a:hover {
  background-color: var(--sand-dark);
}
[data-theme=dark] nav ul a[data-current="current item"], .dark-theme nav ul a[data-current="current item"] {
  background-color: var(--tertiary-color-light);
  color: var(--green-jungle);
}

/* https://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  background-color: var(--primary-color-light);
  -webkit-font-smoothing: antialiased;
  color: var(--secondary-color-dark);
  font-display: auto;
  font-family: "GintonaSans";
  font-size: 1.5rem;
  font-variation-settings: "opsz" 9;
  font-weight: 350;
  height: 100%;
  line-height: 1.7;
  word-wrap: break-word;
}
.dark-theme body {
  color: var(--secondary-color-lighter);
}

main {
  min-height: 60vh;
  max-width: 110rem;
  padding: 2em 4%;
  margin: 0 auto;
}

.clearfix:after {
  clear: both;
  content: " ";
  display: block;
  font-size: 0;
  height: 0;
  visibility: hidden;
}

header {
  align-content: space-between;
  align-items: center;
  display: flex;
  flex-direction: row;
  font-family: "GintonaSans";
  justify-content: space-between;
  margin: 0 auto;
  max-width: 110rem;
  padding: 1.7rem 4% 0 4%;
  position: relative;
}
.home header span {
  display: none;
}

svg {
  stroke: var(--gold-darkest) !important;
}
.dark-theme svg {
  stroke: var(--gold) !important;
}

.ampersam {
  width: 60px;
  height: 62.666664px;
  max-width: 100%;
  -right: 20px;
  display: inline-block;
  vertical-align: middle;
  fill: var(--tertiary-color-dark);
}
.ampersam:hover {
  fill: var(--secondary-color-dark);
}

.logo-container {
  margin-right: 10px;
  display: flex;
  flex-direction: row;
}
@media screen and (min-width: 48em) {
  .logo-container {
    margin-bottom: 0;
  }
}

hr {
  border: 2px solid var(--secondary-color-medium);
  height: 2px;
  margin: 2em auto;
  width: 60%;
  border-radius: 8px;
}

nav ul {
  align-items: center;
  background-color: var(--white);
  border-radius: 30px;
  column-gap: 0.4rem;
  display: flex;
  flex-direction: row;
  font-size: 0.7rem;
  justify-content: space-evenly;
  margin-top: 20px;
  padding: 0.4rem;
}
@media screen and (min-width: 32em) {
  nav ul {
    font-size: 0.9rem;
    margin-top: 0;
  }
}
nav li {
  list-style-type: none;
  margin: 0;
}
nav a {
  display: block;
  border-radius: 30px;
  font-weight: 700;
  letter-spacing: 2px;
  text-decoration: none;
  text-transform: uppercase;
  padding: 0.4rem 0.6rem;
}
nav a:hover {
  background-color: var(--primary-color-light);
}
nav a[data-current="current item"] {
  background-color: var(--tertiary-color-light);
}
nav .theme-switcher-container {
  border-left: 2px solid var(--primary-color-dark);
  padding-left: 0.3rem;
  margin-left: 0.1rem;
  height: 2rem;
  overflow: hidden;
}
nav #themeSwitcher {
  border: 0;
  margin: 0;
  padding: 0;
  width: 2rem;
  height: 2rem;
  background: transparent url("/static/img/icons/moon-star.svg") no-repeat center;
}
.dark-theme nav #themeSwitcher {
  background-image: url("/static/img/icons/sun.svg");
}

footer {
  background: var(--primary-color-medium);
  color: var(--secondary-color-dark);
  font-family: "GintonaSans";
  font-size: 1rem;
  font-weight: 400;
  text-align: center;
  position: relative;
}
.dark-theme footer {
  background-color: var(--green-jungle-darker);
}
@media screen and (min-width: 40em) {
  footer {
    border-radius: 8px;
    margin: 0 20px;
  }
}
footer .inner {
  margin: 0 auto;
  max-width: 52rem;
  padding: 2.125rem 4% 3.4rem 4%;
}
footer a {
  color: var(--secondary-color-dark);
  text-decoration-color: var(--secondary-color-dark);
}
footer span {
  display: block;
}
footer svg {
  stroke: var(--secondary-color-light);
}

[hidden] {
  display: none;
}

::-moz-selection,
::selection {
  background: var(--tertiary-color-dark);
  color: var(--primary-color-light);
}

.bold,
strong {
  font-weight: 600;
}

em,
i {
  font-style: italic;
}

sub,
sup {
  font-family: "GintonaSans";
  position: relative;
  top: -0.4em;
  vertical-align: baseline;
}

sub {
  top: 0.4em;
}

a {
  color: var(--secondary-color-dark);
  text-decoration-color: var(--tertiary-color-dark);
  text-decoration-skip: auto;
  -webkit-text-decoration-skip: auto;
  text-decoration-thickness: 2px;
}

time {
  color: var(--secondary-color-dark);
  font-family: "GintonaSans";
  font-weight: 500;
}

.icon-title {
  display: flex;
  align-items: center;
}
.icon-title svg {
  margin-right: 8px;
}
.icon-title span {
  font-family: "GintonaSans";
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-style: normal;
}

main a,
main a:visited {
  color: currentColor;
  font-weight: 400;
}
main a:focus, main a:hover,
main a:visited:focus,
main a:visited:hover {
  color: var(--tertiary-color-dark);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-display: auto;
  font-family: "GintonaSans";
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: normal;
  word-spacing: normal;
  word-wrap: break-word;
}

h1 {
  font-family: "GintonaSans";
  font-weight: 800;
  font-size: 3.5rem;
  margin-top: 1.7rem;
}
@media screen and (max-width: 80rem) {
  h1 {
    font-size: 2.5rem;
  }
}

h2 {
  font-family: "GintonaSans";
  font-size: 1.9rem;
  font-weight: 800;
  margin: 0.6rem 0 1.7rem;
}

h3 {
  font-size: 1.5rem;
}

.post h1,
.post h2,
.post h3,
.post h4,
.post h5,
.post h6,
.post blockquote,
.post p,
.post small,
.post span,
.post ul,
.post ol, .post time,
.post .pagination,
.post .tags,
.pages h1,
.pages h2,
.pages h3,
.pages h4,
.pages h5,
.pages h6,
.pages blockquote,
.pages p,
.pages small,
.pages span,
.pages ul,
.pages ol,
.pages time,
.pages .pagination,
.pages .tags {
  max-width: 52rem;
  margin-left: auto;
  margin-right: auto;
}

.pagination {
  font-family: "GintonaSans";
  font-size: 1rem;
  font-weight: 400;
  margin: 3.4rem 0 0;
  text-align: center;
}
.pagination a {
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  display: inline;
}

p {
  margin-bottom: 3.4rem;
}
@media screen and (max-width: 40rem) {
  p {
    font-size: 1.2rem;
  }
}

.meta {
  display: block;
  font-family: "GintonaSans";
  font-size: 0.75em;
}

ol,
ul {
  margin: 30px auto;
  padding-left: 22px;
}

ul {
  list-style-type: disc;
}

ol {
  list-style-type: decimal;
}

li {
  line-height: 1.4;
  margin-bottom: 25px;
}

blockquote {
  display: block;
  font-family: "GintonaSans";
  font-style: italic;
  margin: 2rem auto;
  overflow: hidden;
  padding: 0px 16px;
}
blockquote p {
  font-family: "GintonaSans";
  margin: 0;
  font-size: 1.5rem;
  font-weight: 550;
}
@media screen and (max-width: 40rem) {
  blockquote p {
    font-size: 1.2rem;
  }
}
blockquote p:first-of-type::before {
  content: "“";
  margin-left: -15px;
  margin-right: 0px;
}
blockquote p:first-of-type::after {
  content: "”";
  margin-right: -15px;
}
blockquote p:last-of-type {
  font-weight: 400;
}
blockquote cite {
  font-family: "GintonaSans";
  font-size: 1.2rem;
}
li blockquote {
  font-style: normal;
  line-height: 1.7;
  margin-bottom: 3.4rem;
}

.testimonials {
  list-style-type: none !important;
}
.testimonials {
  font-style: normal;
  line-height: 1.7;
}

code {
  font-family: "Source Code Pro", monospace;
  font-display: auto;
}

p code {
  font-size: 1.3rem;
  display: inline-block;
  border-radius: 2px;
  background-color: var(--white);
  color: var(--secondary-color-dark);
  box-shadow: 0 1px 1px rgba(122, 130, 136, 0.25);
  line-height: 1.2;
  padding: 0 10px;
}

pre {
  display: block;
  background-color: rgba(0, 0, 0, 0.8);
  overflow-y: hidden;
  overflow-x: auto;
  font-size: 12px;
  padding: 15px;
  border-radius: 4px;
  color: #f8f8f2;
  line-height: 1.4;
  margin: 30px auto;
}

pre code {
  font-size: 14px;
}

small {
  font-size: 1rem;
}

small a {
  color: inherit;
}

.listing-posts ul {
  padding-left: 0;
}
.listing-posts li {
  list-style-type: none;
  max-width: 52rem;
}
.listing-posts article {
  margin-bottom: 1em;
}
.listing-posts p {
  font-size: 0.9em;
  margin: 0;
}

@media all and (min-width: 680px) {
  .subtitle,
  form,
  ol,
  p,
  pre,
  ul {
    margin: 20px 0;
  }
  .Posts p {
    margin-top: 0;
  }
  article::after,
  header::after {
    margin: 70px;
  }
  blockquote p {
    margin: 0;
  }
}
h4 a {
  border: 0;
}

.Speaking a,
.inclusion-list a {
  border-bottom: 0;
}
.Speaking h2,
.inclusion-list h2 {
  line-height: 1;
}
.Speaking .pages ul,
.Speaking ul,
.inclusion-list .pages ul,
.inclusion-list ul {
  margin-top: 0.5rem;
  margin-bottom: 2rem;
}
.listing-posts {
  justify-items: stretch;
  display: grid;
  grid-column-gap: 80px;
  grid-row-gap: 80px;
  grid-template-columns: 1fr;
}
.listing-posts h2 {
  font-family: "GintonaSans";
  font-size: 1.2em;
  line-height: 1.3;
  margin: 10px 0;
}
.listing-posts li {
  font-size: 0.9em;
}
.listing-posts p,
.listing-posts small {
  font-size: 0.9em;
  line-height: 1.4;
  margin: 0;
}
.listing-posts a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  border: 0;
}
.listing-posts .post-container {
  background: var(--white);
  max-width: 52rem;
}
@media screen and (min-width: 1080px) {
  .listing-posts .post-container {
    grid-template-columns: 1fr 3fr;
  }
}

table {
  border-spacing: 0;
  text-align: left;
  font-family: "GintonaSans";
  width: 100%;
}
@media screen and (max-width: 600px) {
  table {
    max-width: 300px;
  }
}
table tbody td {
  vertical-align: top;
}
table th, table tr:first-of-type td:first-of-type {
  border-right: 1px solid var(--primary-color-medium);
  font-size: 1rem;
  white-space: normal;
}
@media screen and (max-width: 600px) {
  table th, table tr:first-of-type td:first-of-type {
    left: 0;
    position: sticky;
    white-space: nowrap;
  }
}
table th, table th a {
  font-weight: 550;
}
table tr {
  background-color: var(--white);
  border-bottom: 1px solid var(--primary-color-medium);
}
table tr:last-of-type {
  border-bottom: 0px;
}
table tr > * {
  padding: 1.4rem;
}
@media screen and (max-width: 600px) {
  table tr > * {
    padding: 0.6rem;
  }
}
table td {
  border-right: 1px solid var(--primary-color-medium);
  font-size: 1rem;
  font-weight: 200;
  line-height: 1.5;
  list-style-type: none;
  margin-bottom: 1.7rem;
}
table td:last-of-type {
  border-right: none;
}
tr:first-child > table td {
  font-weight: 550;
}

.highlight {
  background-color: var(--highlight-background);
  border-radius: 4px;
  color: var(--highlight-color);
  display: inline-block;
  font-family: "Source Code Pro", monospace;
  font-size: 0.9em;
  line-height: 1.4;
  padding: 0 10px;
}

.book-retailers, .about-select {
  border-radius: 8px;
  padding: 1.7rem;
  margin: 3.4rem 0 1.7rem;
}

.table-container {
  margin-bottom: 1.7rem;
  overflow: auto;
}

.caption {
  font-size: 1rem;
  font-style: italic;
  margin-bottom: 0;
}
.table-container .caption {
  margin-left: 0.6rem;
}

.not-italic {
  font-style: normal;
}

.alert {
  align-items: center;
  background-color: var(--primary-color-medium);
  display: flex;
  justify-content: space-around;
  padding: 1.7rem;
  margin: 1.7rem 0 0.6rem;
  border-radius: 4px;
}
.alert p {
  font-family: "GintonaSans";
  margin: 0.4rem 0;
}
.alert .emoji {
  font-size: 3.4rem;
  line-height: 1;
  margin-right: 0.6rem;
}
.dark-theme .alert {
  background-color: var(--green-jungle-darker);
}
.books .alert {
  margin: 3.4rem 0;
}

.tab-buttons {
  display: flex;
}

.tab-button {
  color: var(--green-jungle-darker);
  padding: 10px 20px;
  background-color: var(--primary-color-light);
  border: 0;
  border-right: 1px solid var(--primary-color-light);
  margin-right: 1px;
  cursor: pointer;
  font-weight: 600;
}
.dark-theme .tab-button {
  background-color: var(--green-jungle-medium);
  color: var(--white);
}

.active {
  background-color: var(--white);
}
.dark-theme .active {
  background-color: var(--green-jungle-darker) !important;
  color: var(--white);
}

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}

img {
  max-width: 100%;
  display: block;
}

.img-only {
  margin: 0 -15px;
}

.img-only-source {
  margin: 0 -15px;
  text-align: center;
}

video {
  max-width: 100%;
  height: auto;
}

img, video, iframe {
  border: solid var(--white) 10px;
}

embed,
iframe,
object {
  max-width: 100%;
}

/***********************Image GRid***********************/
.img-grid {
  width: 100%;
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: 25%;
  grid-column-gap: 1%;
  grid-row-gap: 10px;
  background: pink;
}
.img-grid img {
  max-width: 100%;
}

@media screen and (min-width: 350px) {
  .img-grid {
    grid-template-columns: 49.5% 49.5%;
    grid-template-rows: 50%;
  }
}
@media all and (min-width: 680px) {
  .img-only {
    margin: 0 -30px;
  }
  .img-only-source {
    margin: 0 -30px;
  }
}
@media screen and (min-width: 650px) {
  .img-grid {
    grid-template-columns: 32.677% 32.677% 32.677%;
  }
}
.cover-container img {
  max-height: 100px;
  max-width: 100%;
  margin: 0 auto;
}

.Speaking .cover-container {
  background-image: url("/static/img/speaking.jpg");
  background-size: cover;
  -webkit-filter: grayscale(1) brightness(0.75) contrast(1.05);
  filter: grayscale(1) brightness(0.75) contrast(1.05);
}

.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.embed-container iframe, .embed-container object, .embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.full {
  max-width: 100%;
}

.medium {
  max-width: 900px;
}

.limit {
  max-width: 52rem;
  margin: 3.4rem 0;
}

.home .intro-home {
  align-items: center;
  display: grid;
  grid-template-areas: "homephotos" "greeting" "currently";
  position: relative;
}
@media screen and (min-width: 960px) {
  .home .intro-home {
    column-gap: 50px;
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas: "homephotos greeting greeting" "currently currently currently";
  }
}
@media screen and (min-width: 1260px) {
  .home .intro-home {
    grid-template-columns: repeat(12, 1fr);
    grid-template-areas: ". homephotos homephotos . greeting greeting greeting greeting greeting greeting greeting ." "currently currently currently currently currently currently currently currently currently currently currently currently";
  }
}
.home .intro-home .home-photos {
  grid-area: homephotos;
  position: relative;
  margin: 0 auto;
  width: 230px;
  min-height: 300px;
}
.home .intro-home .me {
  position: relative;
  left: -5px;
  width: 200px;
  animation: floatphoto 5s infinite;
}
@keyframes floatphoto {}
.home .intro-home .book {
  position: absolute;
  top: 25px;
  right: -25px;
  animation: floatbook 8s ease-in-out infinite;
  max-width: 100px;
}
@keyframes floatbook {
  0% {
    transform: translate(0, 0);
  }
  50% {
    transform: translate(0, 15px);
  }
  100% {
    transform: translate(0, 0);
  }
}
@keyframes floatfood {
  0% {
    transform: rotate(-6deg);
    transform-origin: 50% 100%;
  }
  50% {
    transform: rotate(-3deg);
  }
  100% {
    transform: rotate(-6deg);
    transform-origin: 50% 100%;
  }
}
.home .intro-home .food {
  max-width: 125px;
  position: absolute;
  top: 150px;
  left: -30px;
  z-index: 99;
  animation: floatfood 5s linear infinite;
}
.home .greeting {
  grid-area: greeting;
}
.home .greeting h1 {
  line-height: 1.3;
  margin-bottom: 1.7rem;
  font-size: 1.9rem;
}
@media screen and (min-width: 1560px) {
  .home .greeting h1 {
    font-size: 3.4rem;
  }
}

.currently {
  display: grid;
  grid-area: currently;
  justify-content: space-between;
  grid-template-columns: 1fr;
  column-gap: 1.7rem;
  margin: 3rem 0;
  gap: 1.7rem;
}
.currently > div {
  background-color: var(--primary-color-medium);
  border-radius: 8px;
  padding: 2rem;
}
.dark-theme .currently > div {
  background-color: var(--green-jungle-darkest) !important;
}
@media screen and (min-width: 620px) {
  .currently {
    grid-template-columns: 1fr 1fr;
    margin: 6rem 0 3rem;
    padding: 4rem 2rem;
  }
}
@media screen and (min-width: 960px) {
  .currently {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (min-width: 1260px) {
  .currently {
    grid-template-columns: repeat(5, 1fr);
  }
}
.currently p {
  font-size: 1.2rem;
  font-weight: 400;
  margin: 0.4rem 0;
  line-height: 1.5;
}

.recent-outer {
  display: grid;
  padding: 1rem;
  grid-template-areas: "posts" "clips";
}
@media screen and (min-width: 860px) {
  .recent-outer {
    grid-template-columns: 3 1fr;
    grid-template-areas: "posts posts posts clips";
    padding: 2rem;
    column-gap: 50px;
  }
}
@media screen and (min-width: 1260px) {
  .recent-outer {
    grid-template-columns: 12, 1fr;
    grid-template-areas: ". posts posts posts posts posts posts posts . clips clips .";
    padding: 8rem 2rem;
    column-gap: 80px;
  }
}
.recent-outer h2 {
  font-family: "GintonaSans";
  font-size: 0.9rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 3px;
  line-height: 1.3;
  margin: 3.4rem 0 0.6rem 0;
  text-transform: uppercase;
  text-align: center;
}
@media screen and (min-width: 860px) {
  .recent-outer h2 {
    margin: 0.6rem 0 3.4rem;
  }
}
.recent-outer ul, .recent-outer ol {
  list-style-type: none;
  padding: 0;
}
.recent-outer ul li, .recent-outer ol li {
  margin-bottom: 70px;
}
.recent-outer ul li:last-of-type, .recent-outer ol li:last-of-type {
  margin-bottom: 0px;
}
.recent-outer ul article p, .recent-outer ol article p {
  font-family: "GintonaSans";
  font-size: 1.2rem;
  margin: 0;
}
.recent-outer ul article time, .recent-outer ol article time {
  display: block;
  font-size: 1rem;
}
.recent-outer ul article a, .recent-outer ol article a {
  font-weight: 600;
  text-decoration-color: var(--tertiary-color-dark);
}
.recent-outer ul article a:hover, .recent-outer ol article a:hover {
  color: var(--tertiary-color-dark);
}

.recent-posts {
  grid-area: posts;
}
.recent-posts h3 {
  font-family: "GintonaSans";
  font-size: 1.5rem;
  line-height: 1.3;
  word-spacing: 2px;
  font-weight: 600;
  font-variation-settings: "opsz" 50;
}
@media screen and (min-width: 40em) {
  .recent-posts h3 {
    font-size: 1.7rem;
  }
}

.recent-clips {
  grid-area: clips;
}
.recent-clips h3 {
  font-family: "GintonaSans";
  font-size: 1.2rem;
  line-height: 1.8;
  font-weight: 600;
}
.recent-clips ul li, .recent-clips ol li {
  margin-bottom: 40px;
}
.recent-clips ul li:last-of-type, .recent-clips ol li:last-of-type {
  margin-bottom: 0px;
}

.book-main {
  background-color: var(--white);
  border-radius: 8px;
  display: grid;
  padding: 1.7rem;
  grid-template-areas: "book-container" "book-caption";
  place-items: center;
}
.dark-theme .book-main {
  background-color: var(--green-jungle-darkest);
}
@media screen and (min-width: 1060px) {
  .book-main {
    grid-template-columns: 10, 1fr;
    grid-template-areas: ". . book-container book-container book-container book-caption book-caption book-caption . .";
    gap: 50px;
    padding: 5.1rem 1.7rem;
  }
}
.home .book-main {
  justify-content: space-around;
}
.book-main .book-container {
  grid-area: book-container;
  margin: 3rem auto 2rem;
  position: relative;
}
.book-main .book-container .sticker-container {
  height: 200px;
  left: -25px;
  position: absolute;
  top: 50px;
  width: 105px;
  z-index: 3;
}
.book-main .book-container .book-sticker {
  animation: sticker 23s linear infinite;
  background-position: center;
  background: url(/static/img/pages/sticker.svg) no-repeat;
  height: 105px;
  width: 105px;
}
@keyframes sticker {
  100% {
    transform: rotate(1turn);
  }
}
.book-main .book-container .book-sticker__text {
  color: var(--white) !important;
  font-family: "GintonaSans";
  font-size: 1.2rem;
  font-weight: 800;
  line-height: 1;
  position: absolute;
  text-align: center;
  font-style: italic;
  top: 33px;
  width: 105px;
}
.book-main .book-container .book-cover {
  background: url(/static/img/pages/idc-book-cover.png) no-repeat;
  background-size: cover;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  height: 464.4px;
  max-width: 100%;
  min-width: 300px;
}
.book-main .book-caption {
  grid-area: book-caption;
  font-family: "GintonaSans";
  font-size: 1.2rem;
  text-align: left;
}
.book-main .book-caption .icon-title {
  text-align: left;
  line-height: 1.3 !important;
}

.book-links {
  display: flex;
  gap: 0.6rem;
}
@media screen and (max-width: 520px) {
  .book-links {
    flex-direction: column;
  }
}
.book-links a {
  border-radius: 80px;
  font-family: "GintonaSans";
  font-size: 1rem;
  margin-right: 0.6rem;
  padding: 0.6rem 2.125rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 1px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
}
.book-links a:first-of-type, .book-links a:nth-of-type(2) {
  background-color: var(--secondary-color-dark);
  color: var(--white);
}
.book-links a:first-of-type:hover, .book-links a:nth-of-type(2):hover {
  background-color: var(--tertiary-color-medium);
  color: var(--white);
}
.dark-theme .book-links a:first-of-type, .dark-theme .book-links a:nth-of-type(2) {
  background-color: var(--primary-color-dark);
  color: var(--white);
}
.dark-theme .book-links a:first-of-type:hover, .dark-theme .book-links a:nth-of-type(2):hover {
  background-color: var(--green-jungle-darker);
  color: var(--white);
}
.book-links a:nth-of-type(3) {
  background-color: var(--primary-color-dark);
  color: var(--secondary-color-dark);
}
.book-links a:nth-of-type(3):hover {
  background-color: var(--green-jungle-darker);
  color: var(--secondary-color-light);
}
.dark-theme .book-links a:nth-of-type(3) {
  background-color: var(--green-jungle-darker);
  color: var(--white);
}

.select-summary {
  display: grid;
  margin: 2rem 0;
  padding: 1.7rem;
  grid-template-areas: "summary" "tables";
}
@media screen and (min-width: 860px) {
  .select-summary {
    grid-template-columns: 0.5fr 1fr 2fr;
    grid-template-areas: ". summary tables";
    margin: 6rem 0 2rem;
    column-gap: 50px;
  }
}
.select-summary .summary {
  margin: 0;
  grid-area: summary;
}
.select-summary .inner {
  margin: 0;
  grid-area: tables;
}

.post-list {
  max-width: 52rem;
}
.post-list li {
  list-style-type: none;
  margin-top: 1.7rem;
}
@media screen and (min-width: 52rem) {
  .post-list li {
    align-items: center;
    display: grid;
    column-gap: 1.7rem;
    grid-template-columns: 1fr 7fr;
    grid-template-rows: 1fr;
    margin-top: 3rem;
  }
}
.post-list li > span {
  font-size: 0.9rem;
  line-height: 1;
}
@media screen and (max-width: 52rem) {
  .post-list li > span {
    justify-self: start;
  }
}
.post-list li h2 {
  font-size: 1.5rem;
  margin: 0;
}
@media screen and (min-width: 52rem) {
  .post-list li h2 {
    font-size: 1.9rem;
  }
}
.post-list li h2 a {
  font-weight: 600;
}

.post {
  /*   a {
      background-image: none;
      font-family: $sans;
      font-size: $s-font-size;
      font-weight: 700;
      text-transform: uppercase;
    } */
}
.post article {
  max-width: 62rem;
  margin: 0 auto;
}
.post article li {
  line-height: 1.7;
  margin-bottom: 0.6rem;
}
.post h1 {
  margin-bottom: 0.5em;
}
.post h2 {
  font-size: 1.9rem;
  margin-top: 3.4rem;
  margin-bottom: 0.6rem;
  font-weight: 800;
  text-align: left;
}
.post time {
  display: block;
  margin: 1.7rem auto;
}
.post ul, .post iframe, .post img {
  margin: 1.7rem auto;
}
.post .tags {
  display: block;
  margin: 3.4rem auto 1.7rem auto;
}
.post a[rel=tag],
.post a[rel=tag]:visited {
  background-color: var(--primary-color-medium);
  border: 1px solid var(--primary-color-dark);
  color: var(--secondary-color-dark);
  display: inline-block;
  letter-spacing: 0.1em;
  line-height: 0.9;
  margin: 0 0.5em 0.5em 0;
  border-radius: 0.5rem;
  font-family: "GintonaSans";
  font-size: 0.8rem;
  font-weight: 563;
  padding: 0.3rem 0.5rem;
  text-decoration: none;
  text-transform: uppercase;
}
.post a[rel=tag]:hover {
  color: var(--secondary-color-dark);
}
.post a[rel=tag]:last-child {
  margin-right: 0;
}
#disqus_thread {
  margin-bottom: 50px;
  margin-top: 50px;
  max-width: 52rem;
}

.clips-header {
  font-family: "GintonaSans";
  font-size: 1.5rem;
  text-align: center;
}

.about h2 {
  font-family: "GintonaSans";
  font-style: italic;
  text-align: center;
  margin: 0.6rem 0 1.7rem;
}

.about-container {
  margin-bottom: 1.2rem;
}
@media screen and (min-width: 52rem) {
  .about-container {
    align-items: center;
    display: flex;
    flex-direction: row;
    gap: 3.4rem;
  }
}
.about-container p {
  font-family: "GintonaSans";
  font-size: 1.5rem;
  font-weight: 300;
}
.about-container h1 {
  margin: 1.5rem 0;
}

/* 
  @media screen and (min-width: $max-w-base) {
    display: flex;
    justify-content: space-between;
  }

  div {
    margin-top: $large-spacing;
    max-width: 25rem;
  } */
form {
  max-width: 52rem;
}

input,
textarea {
  font-family: "GintonaSans";
  font-size: 1.2rem;
  display: block;
  border-radius: 8px;
  margin-bottom: 30px;
  border: 1px solid var(--primary-color-dark);
  padding: 8px 15px;
  width: 100%;
  box-sizing: border-box;
}

button[type=submit] {
  border: 0;
  font-family: "GintonaSans";
  font-weight: 600;
  padding: 8px 15px;
  border-radius: 80px;
  font-size: 1rem;
  margin-right: 0.6rem;
  padding: 0.6rem 2.125rem;
  letter-spacing: 1px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
  background-color: var(--secondary-color-dark);
  color: var(--primary-color-light);
}
button[type=submit]:hover {
  background-color: var(--tertiary-color-dark);
}

label {
  font-family: "GintonaSans";
  font-size: 1rem;
  font-weight: 550;
}

.inner {
  margin: 0 auto;
  max-width: 52rem;
  padding: 2rem 0;
  position: relative;
}
.writing .inner {
  max-width: 52rem;
}
@media screen and (max-width: 40rem) {
  .inner {
    padding: 0;
  }
}

.books ul {
  padding-left: 0;
}
.books .book-main {
  background-color: transparent;
  display: grid;
  grid-template-areas: "bookcovernosticker" "bookcaptionnosticker";
}
@media screen and (min-width: 66rem) {
  .books .book-main {
    grid-template-columns: 6, 1fr;
    grid-template-areas: "bookcovernosticker bookcovernosticker bookcaptionnosticker bookcaptionnosticker bookcaptionnosticker bookcaptionnosticker";
  }
}
.books .book-container {
  grid-area: bookcovernosticker;
  margin: 0 auto;
}
@media screen and (min-width: 66rem) {
  .books .book-container {
    margin: 0;
  }
}
.books .book-caption {
  grid-area: bookcaptionnosticker;
  padding: 0 1.7rem;
}
.books .book-caption p {
  font-family: "GintonaSans";
  font-weight: 400;
  margin-bottom: 0;
}
.books h3 {
  font-weight: 600;
  margin-bottom: 25px;
}
.books .book-links {
  margin-bottom: 2rem;
}

.gr_grid_container {
  display: grid;
  width: 100%;
  padding: 1.7rem 0;
  margin: 0 auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 1.7rem;
  grid-row-gap: 1.7rem;
  align-items: end;
}

.gr_grid_book_container img {
  box-sizing: border-box;
  width: 100%;
}

.shell {
  padding: 3.4rem 5%;
  background: var(--secondary-color-dark);
}
.shell h3 {
  color: white;
}

@media screen and (min-width: 50em) {
  .gr_grid_container {
    grid-template-columns: repeat(6, 1fr);
  }
}
.links header {
  margin: 0 auto;
  display: block;
}
.links header .logo {
  margin: 0 auto;
  width: 60px;
}
.links header .ampersam {
  margin-right: 0;
}
.links .alt-main {
  max-width: 35rem;
  margin: 0 auto;
  padding: 1rem 4;
}
.links .alt-main h1 {
  font-family: "GintonaSans";
  font-size: 2.5rem;
  font-weight: 800;
  margin-top: 0;
  text-align: center;
}
.links .alt-main h2 {
  font-family: "GintonaSans";
  font-size: 1.2rem;
  text-align: center;
  font-style: normal;
  font-weight: 600;
  margin-top: 3rem;
}
.links ul {
  list-style-type: none;
  list-style-position: inside;
  padding-left: 0;
}
.links a, .links a:visited {
  background-color: var(--primary-color-lighter);
  border: 1px solid var(--primary-color-dark);
  display: inline-block;
  font-size: 1rem;
  line-height: 1;
  border-radius: 60px;
  font-family: "GintonaSans";
  font-weight: 600;
  padding: 1rem 0;
  text-align: center;
  text-decoration: none;
  width: 100%;
}
.links a:hover, .links a:visited:hover {
  background-color: var(--primary-color-medium);
  color: var(--secondary-color-dark);
  border: 1px solid var(--primary-color-dark);
}
.links .other-list ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.links .other-list li {
  width: 48%;
}
.links li {
  margin-bottom: 15px !important;
}

@font-face {
  font-family: "GintonaSans";
  src: url("/static/webfonts/GintonaSans-Variable.ttf") format("truetype");
  font-weight: 100 200 300 400 500 600 700 800 900;
  font-display: swap;
  font-style: normal;
  font-optical-sizing: auto;
}
/* \ */

/*# sourceMappingURL=style.css.map */