/*!****************************************************************************************************************************************************************************!*\
  !*** css ../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!../node_modules/stylus-native-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./styl/main.styl ***!
  \****************************************************************************************************************************************************************************/
/*!
Theme Name:     Monk-theme
Description:    Monk Magazine Custom theme.
Author:         Adam Haley
Version:        0.3.0
*/
body {
  display: grid;
  color: #000;
  background-color: #fff;
  grid-template-columns: 1fr 6fr 1fr;
  font-family: 'Oswald', sans-serif;
  font-size: 0.9em;
  line-height: 1.2em;
}
body .wp-site-blocks {
  padding: 1em;
}
img {
  display: block;
  max-width: 100%;
}
img.header {
  margin: 0.2em;
  float: left;
  width: 100%;
}
.sm img.header,
.md img.header {
  width: 100%;
}
.fa-plus:hover {
  color: #fb0303;
}
a {
  padding: none;
  margin: none;
  text-decoration: none;
  color: #000;
  display: inline;
}
a:hover {
  color: #fb0303;
  text-decoration: underline;
}
ul.nav-menu {
  display: none;
  opacity: 0;
  list-style: none;
  background-color: #fff;
  width: 100%;
  height: 100%;
  position: absolute;
  top: -100px;
  left: 0;
  z-index: 1000;
  opacity: 0;
  transition: all linear 0.2s;
  font-size: 1.5em;
}
ul.nav-menu.active {
  top: 0;
  opacity: 1;
  transition: all ease-in-out 0.2s;
  position: fixed;
}
ul.nav-menu.displayed {
  display: block;
}
.xs ul.nav-menu,
.sm ul.nav-menu,
.md ul.nav-menu {
  font-size: 2em;
}
ul.nav-menu li:first-child {
  margin-top: 10em;
}
.xs ul.nav-menu li:first-child,
.sm ul.nav-menu li:first-child,
.md ul.nav-menu li:first-child {
  margin-top: 2em;
}
ul.nav-menu li {
  align: center;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1em;
}
ul.nav-menu li a {
  text-decoration: none;
  color: #000;
  text-align: center;
  display: block;
}
ul.nav-menu li a:hover {
  color: #fb0303;
  text-decoration: underline;
}
ul.nav-menu .social-links {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  margin-bottom: 1em;
  width: 100%;
  text-align: center;
}
ul.nav-menu .social-links svg {
  transform: scale(0.8);
  margin: 0.5em;
  cursor: pointer;
}
ul.nav-menu .social-links svg:hover {
  fill: #fb0303;
}
.hamburger {
  cursor: pointer;
  margin-right: 0.2em;
  margin-top: 0.5em;
  width: 2em;
  height: 2em;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2000;
}
.hamburger img {
  width: 80%;
  height: 80%;
}
.hamburger svg {
  width: 100%;
  height: 100%;
  fill: #000;
/*
		&:hover
			fill #fb0303
		*/
}
.hamburger .menu {
  display: block;
}
.hamburger .close {
  display: none;
}
.hamburger.active {
  position: fixed;
}
.hamburger.active .menu {
  display: none;
}
.hamburger.active .close {
  display: block;
}
img.simple-mobile-true {
  height: 4em;
  margin-top: 6%;
  margin-bottom: 2%;
  margin-left: 20%;
}
.xs img.simple-mobile-true {
  height: auto;
  width: 80%;
  margin-left: 12%;
}
.sm img.simple-mobile-true {
  height: 2em;
  margin-bottom: 0;
}
.md img.simple-mobile-true {
  height: 3em;
  margin-bottom: 0;
}
.lg img.simple-mobile-true {
  margin-left: 15%;
}
img.read-this {
  height: 2em;
  margin-top: 0em;
}
.xs img.read-this,
.sm img.read-this,
.md img.read-this {
  margin-top: 0;
}
.xs img.read-this {
  height: 1.5em;
}
img.more {
  cursor: pointer;
  height: 1em;
  margin-top: 0.5em;
}
a.more-link {
  display: block;
  text-decoration: none;
  padding: 0.5em;
  height: 0.8em;
  color: #000;
}
a.more-link:hover {
  color: #000;
}
a.more-link img {
  display: inline-block;
  margin-right: 0.2em;
}
a.more-link i {
  display: inline-block;
  position: relative;
  margin-left: 0.2em;
  color: #000 !important;
}
a.more-link i:hover {
  color: #fb0303 !important;
}
.gutter {
  width: 100%;
  grid-row: span 5;
}
.container {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 1em;
  padding-left: none !important;
  padding-right: none !important;
}
.container .monk-row {
  grid-column-start: 2;
  grid-column-end: 10;
}
.xs .container .monk-row,
.sm .container .monk-row,
.md .container .monk-row {
  grid-column-start: 1;
  grid-column-end: 10;
}
.container .buy {
  margin-top: 4em;
  grid-column-start: 1;
  grid-column-end: 8;
}
.container .buy img {
  height: 1.5em;
  display: block;
  max-width: none;
}
.xs .container .buy img {
  height: 1.1em;
}
.container a.cart {
  display: block;
  text-decoration: none;
  padding: 0.5em;
  height: 0.8em;
  margin-top: 4em;
  grid-column-start: 9;
  grid-column-end: 10;
  color: #000;
}
.container a.cart b {
  display: inline-block;
  margin-right: 0.5em;
}
.xs .container a.cart,
.sm .container a.cart {
  margin-top: 0;
}
.container a.cart img {
  display: inline-block;
  margin-right: 0.2em;
}
.container a.cart i {
  font-weight: 600;
  position: relative;
  color: #000 !important;
}
.container a.cart i:hover {
  color: #fb0303 !important;
}
.container .content {
  display: block;
  position: relative;
  grid-column-start: 5;
  grid-column-end: 10;
}
.lg .container .content {
  grid-column-start: 5;
  grid-column-end: 10;
}
.xs .container .content,
.sm .container .content,
.md .container .content {
  grid-column-start: 1;
  grid-column-end: 10;
}
.container span.overflow,
.container div.buy-overflow {
  display: block;
  max-height: 0px;
  overflow: hidden;
  transition: max-height ease-in-out 0.2s;
}
.xs .container span.overflow,
.xs .container div.buy-overflow,
.sm .container span.overflow,
.sm .container div.buy-overflow,
.md .container span.overflow,
.md .container div.buy-overflow {
  padding-top: 3em;
}
.container span.overflow.in,
.container div.buy-overflow.in {
  max-height: 5000px;
}
.container ul.back-issues {
  display: grid;
  grid-column-start: 1;
  grid-column-end: 10;
  grid-template-columns: repeat(6, 1fr);
  gap: 1.5em;
  list-style-type: none;
  counter-reset: issues 0 /* initializes counter to 0; use -1 for zero-based numbering */;
  margin: 0 !important;
  padding: 0 !important;
}
.md .container ul.back-issues,
.sm .container ul.back-issues {
  grid-template-columns: repeat(4, 1fr);
  gap: 1em 1em;
}
.md .container ul.back-issues li.issue,
.sm .container ul.back-issues li.issue {
  grid-column-start: auto;
  grid-column-end: auto;
}
.md .container ul.back-issues li.issue img,
.sm .container ul.back-issues li.issue img {
  width: 100%;
  height: auto;
}
.md .container ul.back-issues li.issue img:hover,
.sm .container ul.back-issues li.issue img:hover {
  transform: scale(1.05);
}
.xs .container ul.back-issues {
  grid-template-columns: 1fr;
  gap: 1em;
}
.xs .container ul.back-issues li.issue {
  grid-column-start: auto;
  grid-column-end: auto;
}
.xs .container ul.back-issues li.issue img {
  width: 100%;
  height: auto;
}
.xs .container ul.back-issues li.issue img:hover {
  transform: scale(1.03);
}
.container ul.back-issues li.issue {
  cursor: pointer;
  position: relative;
}
.xs .container ul.back-issues li.issue,
.sm .container ul.back-issues li.issue {
  margin-bottom: 1em;
}
.container ul.back-issues li.issue:after {
  content: counter(issues);
  z-index: 500;
  color: #fc0003;
  counter-increment: issues 1 /* Increase the counter by 1. */;
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: -0.4em;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  font-size: 1.5em;
  font-weight: 600;
}
.xs .container ul.back-issues li.issue:after {
  bottom: -0.2em;
  font-size: 3em;
}
.container ul.back-issues li.issue img {
  transform: scale(1);
  transition: all ease-in-out 0.2s;
}
.container ul.back-issues li.issue img:hover {
  transform: scale(1.1);
}
.container div.buy-overflow {
  grid-column-start: 1;
  grid-column-end: 10;
}
.container div.buy-overflow.in {
  max-height: 20000px;
}
.container ul.more-stuff {
  display: grid;
  grid-column-start: 1;
  grid-column-end: 10;
  grid-template-columns: repeat(6, 1fr);
  gap: 1.5em;
  list-style-type: none;
  margin-bottom: 1em;
}
.md .container ul.more-stuff,
.sm .container ul.more-stuff {
  grid-template-columns: repeat(4, 1fr);
  gap: 1em 1em;
}
.md .container ul.more-stuff li.product,
.sm .container ul.more-stuff li.product {
  grid-column-start: auto;
  grid-column-end: auto;
}
.md .container ul.more-stuff li.product img,
.sm .container ul.more-stuff li.product img {
  width: 100%;
  height: auto;
}
.md .container ul.more-stuff li.product img:hover,
.sm .container ul.more-stuff li.product img:hover {
  transform: scale(1.05);
}
.xs .container ul.more-stuff {
  grid-template-columns: 1fr;
  gap: 1em;
}
.xs .container ul.more-stuff li.product {
  grid-column-start: auto;
  grid-column-end: auto;
}
.xs .container ul.more-stuff li.product img {
  width: 100%;
  height: auto;
}
.xs .container ul.more-stuff li.product img:hover {
  transform: scale(1.03);
}
.container ul.more-stuff li.product {
  cursor: pointer;
  position: relative;
}
.xs .container ul.more-stuff li.product,
.sm .container ul.more-stuff li.product {
  margin-bottom: 1em;
}
.container ul.more-stuff li.product img {
  transform: scale(1);
  transition: all ease-in-out 0.2s;
}
.container ul.more-stuff li.product img:hover {
  transform: scale(1.1);
}
.more-stuff-to-buy {
  display: block;
  z-index: 500;
  grid-column-start: 7;
  grid-column-end: 10;
  text-decoration: none;
  height: 1em;
  width: 100%;
  margin-top: -2em;
  margin-left: 2em;
  color: #000;
}
.more-stuff-to-buy:hover {
  color: #000;
  text-decoration: none;
}
.xs .more-stuff-to-buy,
.sm .more-stuff-to-buy,
.more-stuff-to-buy margin-top 0,
.md .more-stuff-to-buy {
  margin-top: 5em;
}
.more-stuff-to-buy img {
  display: inline-block;
}
.xs .more-stuff-to-buy img {
  height: 1em;
  margin-top: 1em;
}
.md .more-stuff-to-buy img {
  margin-top: 2em;
}
.more-stuff-to-buy i {
  position: relative;
  display: inline-block;
  color: #000 !important;
}
.more-stuff-to-buy i:hover {
  color: #fb0303 !important;
}
.md .more-stuff-to-buy,
.sm .more-stuff-to-buy {
  width: 100%;
  margin-top: 1em;
  grid-column-start: 7;
  grid-column-end: 11;
}
.md .more-stuff-to-buy img,
.sm .more-stuff-to-buy img {
  width: 80%;
  height: auto;
  margin-right: 0.2em;
}
.xs .more-stuff-to-buy {
  margin-top: 0;
  margin-bottom: 1em;
  grid-column-start: 1;
  grid-column-end: 9;
}
.xs .more-stuff-to-buy img {
  width: 80%;
  height: auto;
  margin-right: 0.2em;
}
.on-the-road {
  display: grid;
  grid-column-start: 1;
  grid-column-end: 10;
  text-decoration: none;
  padding: 0.5em;
  width: 100%;
  margin-top: 1em;
}
.on-the-road .on-the-road-with-the-monks {
  height: auto;
  max-width: 100%;
}
.on-the-road p {
  float: left;
  width: 50%;
  padding-right: 5em;
}
.xs .on-the-road p,
.sm .on-the-road p,
.md .on-the-road p {
  width: 100%;
  float: none;
  margin-top: 1em;
  padding-right: 0em;
}
.lg .on-the-road p {
  padding-right: 1em;
}
.on-the-road #monk-on-the-road {
  float: right;
  width: 50%;
  max-width: 100%;
}
.xs .on-the-road #monk-on-the-road,
.sm .on-the-road #monk-on-the-road,
.md .on-the-road #monk-on-the-road {
  width: 100%;
  float: none;
  margin-top: 0.5em;
  margin-bottom: 1em;
}
.on-the-road .more-thrills {
  position: relative;
  top: 1em;
  height: 1em;
  color: #000;
}
.on-the-road .more-thrills:hover {
  color: #000;
  text-decoration: none;
}
.on-the-road .more-thrills img {
  display: inline-block;
  margin-right: 0.2em;
  max-width: none;
  height: 1em;
}
.on-the-road .more-thrills i {
  position: relative;
  margin-left: 0.2em;
  display: inline-block;
  color: #000 !important;
}
.on-the-road .more-thrills i:hover {
  color: #fb0303 !important;
}
.overflow-bottom {
  display: block;
  cursor: pointer;
  height: 0em;
  margin-top: 1em;
  transition: all ease-in-out 0.2s;
  grid-column-start: 1;
  grid-column-end: 10;
  grid-row-start: 2;
  grid-row-end: 3;
}
.overflow-bottom i.fa {
  display: none;
}
.in .overflow-bottom {
  height: 1em;
  background-color: #fb0303;
}
.in .overflow-bottom i.fa {
  margin-right: 0.5em;
  display: block;
  float: right;
  color: #000;
}
.in .overflow-bottom:hover i.fa {
  color: #fff;
}
.thrills-overflow {
  display: block;
  grid-column-start: 1;
  grid-column-end: 10;
  max-height: 0px;
  overflow: hidden;
  transition: max-height ease-in-out 0.2s;
  border-bottom: 0em;
  padding-bottom: 0em;
  margin-top: 1.5em;
}
.thrills-overflow .thrills-wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5em;
}
.sm .thrills-overflow .thrills-wrapper {
  gap: 1em;
}
.md .thrills-overflow .thrills-wrapper {
  gap: 1.5em;
}
.xs .thrills-overflow .thrills-wrapper {
  grid-template-columns: 1fr;
  grid-template-rows: repeat(3, 1fr);
  gap: 1em;
  overflow: hidden;
  transition: all ease-in-out 0.2s;
  border-bottom: 0em;
  padding-bottom: 0em;
  margin-top: 1.5em;
}
.thrills-overflow .overflow-bottom {
  display: block;
  height: 0em;
  transition: all ease-in-out 0.2s;
  grid-column-start: 1;
  grid-column-end: 4;
}
.thrills-overflow .overflow-bottom i.fa {
  display: none;
}
.thrills-overflow.in {
  max-height: 20000px;
  transition: max-height ease-in-out 0.2s;
  padding-bottom: 1em;
}
.thrills-overflow.in .overflow-bottom {
  cursor: pointer;
  height: 1em;
  width: 100%;
  background-color: #fb0303;
  grid-row-start: 2;
  grid-row-end: 3;
}
.thrills-overflow.in .overflow-bottom i.fa {
  margin-right: 0.5em;
  display: inline-block;
  float: right;
  color: #000;
}
.thrills-overflow.in .overflow-bottom:hover i.fa {
  color: #fff;
}
.thrills-overflow .thrill {
  width: 100%;
}
.thrills-overflow .thrill img {
  cursor: pointer;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  height: auto;
  transition: all ease-in-out 0.2s;
}
.thrills-overflow .thrill img:hover {
  transform: scale(1.05);
  transition: all ease-in-out 0.2s;
}
.footer {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-template-rows: repeat(3, 1fr);
  content-align: center;
  height: 12em;
}
.footer img.connect {
  grid-row-start: 1;
  grid-row-end: 2;
  grid-column-start: 3;
  grid-column-end: 7;
  margin-top: 1em;
}
.lg .footer img.connect,
.xl .footer img.connect {
  margin-top: 0;
  grid-row-start: 1;
  grid-row-end: 2;
  grid-column-start: 4;
  grid-column-end: 6;
  margin-top: 1em;
}
.footer .social-links {
  grid-row-start: 2;
  grid-row-end: 3;
  display: block;
  margin-top: 2em;
  margin-bottom: 0;
  grid-column-start: 1;
  grid-column-end: 9;
  text-align: center;
}
.footer .social-links svg {
  transform: scale(0.8);
  margin: 1em;
  cursor: pointer;
}
.footer .social-links svg:hover {
  fill: #fb0303;
}
.xs .footer .social-links,
.sm .footer .social-links,
.md .footer .social-links {
  margin-top: 0;
  margin-bottom: 0;
  grid-column-start: 1;
  grid-column-end: 9;
  text-align: center;
}
.xs .footer .social-links svg,
.sm .footer .social-links svg,
.md .footer .social-links svg {
  transform: scale(0.8);
  margin: 1em;
  cursor: pointer;
}
.xs .footer .social-links svg:hover,
.sm .footer .social-links svg:hover,
.md .footer .social-links svg:hover {
  fill: #fb0303;
}
.footer .copyright {
  height: 1em;
  grid-row-start: 3;
  grid-row-end: 3;
  grid-column-start: 1;
  grid-column-end: 10;
  text-align: center;
  font-size: 0.7em;
}
.back-to-top-link {
  cursor: pointer;
  margin-right: 0.2em;
  margin-top: 0.5em;
  width: 2em;
  height: 2em;
  position: fixed;
  bottom: 0;
  right: 0;
  display: none;
  z-index: 2000;
  opacity: 0;
  transition: all ease-in-out 0.2s;
}
.back-to-top-link.in {
  display: block;
}
.back-to-top-link.visible {
  opacity: 1;
}
.back-to-top-link svg {
  width: 80%;
  height: 80%;
}
.back-to-top-link svg:hover {
  fill: #fb0303;
}
#monks-home {
  grid-column-start: 2;
  grid-column-end: 5;
  width: 30em;
  height: 35em;
}
.xs #monks-home {
  grid-column-start: 1;
  grid-column-end: 10;
  width: 100%;
  height: 20em;
  overflow: hidden;
  margin-bottom: 1em;
}
.sm #monks-home,
.md #monks-home {
  grid-column-start: 1;
  grid-column-end: 10;
  width: 100%;
  height: 40em;
  margin-bottom: 1em;
  overflow: hidden;
}
.sm #monks-home img,
.md #monks-home img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% -30%;
  transition: all ease-in-out 0.2s;
}
.sm #monks-home img:hover,
.md #monks-home img:hover {
  transform: scale(1.05);
  transition: all ease-in-out 0.2s;
}
.xl.firefox .container .content {
  grid-column-start: 7;
  grid-column-end: 10;
}
.lg.firefox .container .content {
  grid-column-start: 8;
  grid-column-end: 10;
}
.md.firefox .container .content {
  grid-column-start: 1;
  grid-column-end: 10;
}


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