@charset "UTF-8";
/*!
Theme Name:  It's My Own
Description: Child theme of 'Base Layer' theme
Author:      Martin
Template:    baselayer
Version:     1.0.0

-------------------
HEY\!
DON\'T EDIT THIS CSS FILE\!
MAKE YOUR CHANGES IN THE SASS FILES
-------------------

*/
/* ***** */
/* COLORS */
/* Meaningful colors: */
/* CSS Vars */
:root {
  --blue: #4b627a;
  --turq: #4ecdc4;
  --lime: #c7f464;
  --pink: #ff6b6b;
  --red: #c44d58;
  --grey: #c0c0c0;
  --blue-sat: rgb(51.36, 97.4970212766, 145.64);
  --lime-light-1: rgb(219.6457831325, 248.0554216867, 157.1445783133);
  --lime-dark-1: rgb(178.3542168675, 239.9445783133, 42.8554216867);
  --lime-dark-2: rgb(146.843373494, 206.9156626506, 14.6843373494);
  --turq-dark-1: rgb(48.8546255507, 172.9453744493, 164.1515418502);
  --turq-dark-2: rgb(35.3744493392, 125.2255506608, 118.8581497797);
  --grey-light-1: rgb(222.6, 222.6, 222.6);
  --grey-light-2: rgb(253.2, 253.2, 253.2);
  --grey-dark-2: rgb(130.8, 130.8, 130.8);
  --text: rgb(28.4010152284, 37.1106598985, 46.1989847716);
  --body-bg: rgb(253.2, 253.2, 253.2);
  --button-bg: #4ecdc4;
  --button-text: var(--text);
  --button-border-color: #4ecdc4;
  --button-border-color-hover: rgb(50.76, 232.24, 219.3792125984);
  --text-input: var(--text);
  --link-color: rgb(35.3744493392, 125.2255506608, 118.8581497797);
  --link-hover-color: darken( var(--link), 12 );
  --success: rgb(163.7409638554, 230.7259036145, 16.3740963855);
  --error: rgb(193.3741772152, 28.6258227848, 43.85466227);
  --info: rgb(44.6581218274, 109.8331515282, 177.8418781726);
}

/* ***** */
/* TYPOGRAPHY */
/* @font-face */
@font-face {
  font-family: "Fira Sans Condensed";
  src: local("Fira Sans Condensed"), url("inc/fonts/FiraSansCondensed-Light.otf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fira Sans Condensed";
  src: local("Fira Sans Condensed"), url("inc/fonts/FiraSansCondensed-LightItalic.otf") format("truetype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Fira Sans Condensed";
  src: local("Fira Sans Condensed"), url("inc/fonts/FiraSansCondensed-Regular.otf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fira Sans Condensed";
  src: local("Fira Sans Condensed"), url("inc/fonts/FiraSansCondensed-Italic.otf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Fira Sans Condensed";
  src: local("Fira Sans Condensed"), url("inc/fonts/FiraSansCondensed-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fira Sans Condensed";
  src: local("Fira Sans Condensed"), url("inc/fonts/FiraSansCondensed-ExtraBoldItalic.ttf") format("truetype");
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Lato";
  src: local("Lato"), url("inc/fonts/Lato-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lato";
  src: local("Lato"), url("inc/fonts/Lato-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lato";
  src: local("Lato"), url("inc/fonts/Lato-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Lato";
  src: local("Lato"), url("inc/fonts/Lato-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Caveat";
  src: local("Caveat"), url("inc/fonts/Caveat-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Caveat";
  src: local("Caveat"), url("inc/fonts/Caveat-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
/* CSS VARS */
:root {
  --font-primary: Lato, sans-serif;
  --font-secondary: Fira Sans Condensed, serif;
}

/*
:root {
	--rem:         16px;
	--type-scale:  1.2;
	--gap:         19.2px;

	--font-primary: Lato, sans-serif;
	--font-code:    monaco, consolas, Andale Mono, DejaVu Sans Mono, monospace;

	--font-size-sm: 14.4px;
	--font-size-0:  16px;
	--font-size-1:  19.2px;
	--font-size-2:  23.04px;
	--font-size-3:  27.648px;
	--font-size-4:  33.1776px;

	--wp--preset--font-size--small:  var(--font-size-sm);
	--wp--preset--font-size--medium: var(--font-size-0);
	--wp--preset--font-size--large:  var(--font-size-1);
}
*/
/* ***** */
/* STRUCTURE */
:root {
  --aligndefault: 956.8px;
  --alignwide: 1452.8px;
}
@media screen and (min-width: 956.8px) {
  :root {
    --page-margin: calc( 2 * 19.2px );
  }
}

/*!
Theme Name:  It's My Own
Description: Child theme of 'Base Layer' theme
Author:      Martin
Template:    baselayer
Version:     1.0.0

-------------------
HEY\!
DON\'T EDIT THIS CSS FILE\!
MAKE YOUR CHANGES IN THE SASS FILES
-------------------

*/
/* Typography
--------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  color: var(--blue-sat);
}

h1 {
  font-family: var(--font-secondary);
  font-weight: 300;
}

h2, h3 {
  font-family: var(--font-secondary);
  font-weight: 800;
}

h4 {
  font-weight: 700;
}

del,
strike,
s {
  text-decoration: 2px solid var(--red) line-through;
}

ins,
mark {
  background: var(--lime-light-1);
  padding: 0 3px;
}

pre,
.wp-block-code,
.wp-block-preformatted {
  border: 1px solid var(--grey-light-1);
}

code, kbd, tt, var {
  color: var(--blue-sat);
}

blockquote,
.wp-block-quote {
  border-left: 0.25rem solid var(--lime-dark-1);
}

/* Elements
--------------------------------------------- */
body {
  background: var(--body-bg);
  color: var(--text);
}

/* Admin Bar */
#wpadminbar *:not(li) ul li::marker {
  content: "";
}

*:not(li) > ul {
  list-style-type: square;
}
*:not(li) > ul > li {
  padding-left: 0.5rem;
}
*:not(li) > ul > li::marker {
  content: "❯";
  font-weight: 900;
  color: var(--lime-dark-2);
}
*:not(li) > ul ul {
  list-style-type: disc;
}
*:not(li) > ul ul > li::marker {
  color: var(--error);
}
*:not(li) > ul ul ul {
  list-style-type: circle;
}

/*!
Theme Name:  It's My Own
Description: Child theme of 'Base Layer' theme
Author:      Martin
Template:    baselayer
Version:     1.0.0

-------------------
HEY\!
DON\'T EDIT THIS CSS FILE\!
MAKE YOUR CHANGES IN THE SASS FILES
-------------------

*/
@media screen and (min-width: 1452.8px) {
  .entry-content > .wp-block-image > .alignleft,
  .page-content > .wp-block-image > .alignleft {
    margin-left: calc(-4 * var(--gap));
  }
  .entry-content > .wp-block-image > .alignright,
  .page-content > .wp-block-image > .alignright {
    margin-right: calc(-4 * var(--gap));
  }
}
.wp-block-table table th {
  border-width: 0 0 3px;
  border-color: var(--grey-dark-2);
  border-style: solid;
}
.wp-block-table table td {
  border-color: var(--grey);
}
.wp-block-table table td:first-child {
  border-left: none;
}
.wp-block-table table td:last-child {
  border-right: none;
}

/* Links
--------------------------------------------- */
a {
  color: var(--link-color);
  transition: color 0.5s;
}
a:hover, a:focus {
  color: var(--link-hover-color);
}

/* Forms
--------------------------------------------- */
input[type=text],
input[type=email],
input[type=url],
input[type=password],
input[type=search],
input[type=number],
input[type=tel],
input[type=range],
input[type=date],
input[type=month],
input[type=week],
input[type=time],
input[type=datetime],
input[type=datetime-local],
input[type=color],
textarea {
  color: var(--grey);
  border: 1px solid var(--grey);
  border-radius: var(--border-radius);
  padding: 0.25em;
}
input[type=text]:focus,
input[type=email]:focus,
input[type=url]:focus,
input[type=password]:focus,
input[type=search]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=range]:focus,
input[type=date]:focus,
input[type=month]:focus,
input[type=week]:focus,
input[type=time]:focus,
input[type=datetime]:focus,
input[type=datetime-local]:focus,
input[type=color]:focus,
textarea:focus {
  color: var(--text-input);
  border-color: var(--link-color);
}

select {
  border: 1px solid var(--grey);
}

.comment-form .required {
  color: var(--error);
}

.comment-form textarea[required=""] {
  border-color: var(--error);
}

button,
.wp-block-button__link,
input[type=button],
input[type=reset],
input[type=submit] {
  border: 2px solid;
  border-color: var(--button-border-color);
  border-radius: var(--border-radius);
  background: var(--button-bg);
  color: var(--button-text);
  font-size: var(--font-size-0);
  line-height: 1;
  padding: 0.35rem 1rem 0.5rem;
  margin: 0 0 var(--gap);
}
button:hover, button:active, button:focus,
.wp-block-button__link:hover,
.wp-block-button__link:active,
.wp-block-button__link:focus,
input[type=button]:hover,
input[type=button]:active,
input[type=button]:focus,
input[type=reset]:hover,
input[type=reset]:active,
input[type=reset]:focus,
input[type=submit]:hover,
input[type=submit]:active,
input[type=submit]:focus {
  border-color: var(--button-border-color-hover);
  background-color: transparent;
  color: var(--text);
}

button,
.wp-block-button__link,
input[type=button],
input[type=reset],
input[type=submit] {
  transition: background-color 0.125s;
}

.wp-block-table {
  padding: 0;
}

.site-header {
  background-color: transparent;
}

.page-header {
  width: 100%;
  max-width: var(--alignwide);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--page-margin);
  padding-right: var(--page-margin);
}
@media screen and (min-width: 1529.6px) {
  .page-header {
    padding-left: 0;
    padding-right: 0;
  }
}

.site-title,
.site-title a {
  font-family: var(--font-secondary);
  font-size: var(--font-size-3);
  font-weight: 300;
  line-height: 1;
  color: var(--text);
  text-decoration: none;
}

.site-title a:hover,
.site-title a:focus {
  color: var(--link-color);
  text-decoration: none;
}

.site-description {
  display: none;
}

.site-footer-wrap {
  background-color: var(--grey-light-1);
}

.site-content.w-sidebar {
  display: grid;
  grid-template-columns: 1fr 25%;
  grid-template-rows: auto 1fr;
  grid-auto-columns: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas: "page-header page-header" "site-main sidenav";
  width: 100%;
  max-width: var(--alignwide);
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 782px) {
  .site-content.w-sidebar {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    grid-auto-columns: 1fr;
    grid-template-areas: "page-header" "site-main" "sidenav";
  }
  .site-content.w-sidebar .page-header-inner,
  .site-content.w-sidebar .sidenav {
    padding-left: var(--page-margin);
    padding-right: var(--page-margin);
  }
  .site-content.w-sidebar #primary .entry-content > *:not(.alignfull):not(ol):not(ul) {
    padding-left: var(--page-margin);
    padding-right: var(--page-margin);
  }
}
@media screen and (min-width: 783px) and (max-width: 1529.6px) {
  .site-content.w-sidebar {
    padding-left: var(--page-margin);
    padding-right: var(--page-margin);
  }
}
@media screen and (min-width: 1529.6px) {
  .site-content.w-sidebar {
    grid-template-columns: 1fr 16.667%;
  }
}
.site-content.w-sidebar .page-header {
  grid-area: page-header;
  padding-left: 0;
  padding-right: 0;
}
.site-content.w-sidebar #primary {
  grid-area: site-main;
}
.site-content.w-sidebar #primary .entry-content > :not(hr) {
  margin-left: 0;
  margin-right: 0;
  max-width: calc(100% - var(--page-margin));
}
.site-content.w-sidebar #primary .entry-content > :not(hr).alignfull, .site-content.w-sidebar #primary .entry-content > :not(hr).alignwide {
  padding-right: 0;
}
.site-content.w-sidebar #primary .entry-content > *:not(ul):not(ol):not(.wp-block-table) {
  padding-left: 0;
  padding-right: var(--gap);
}
.site-content.w-sidebar #primary .entry-content > *:not(ul):not(ol):not(.wp-block-table).alignfull, .site-content.w-sidebar #primary .entry-content > *:not(ul):not(ol):not(.wp-block-table).alignwide {
  padding-right: 0;
}
@media screen and (min-width: 1529.6px) {
  .site-content.w-sidebar #primary .entry-content > *:not(.alignfull):not(.alignwide) {
    max-width: var(--aligndefault);
    margin-left: auto;
    margin-right: auto;
  }
}
.site-content.w-sidebar #primary .entry-content > .wp-block-image > .alignleft,
.site-content.w-sidebar #primary .page-content > .wp-block-image > .alignleft {
  margin-left: 0;
}
.site-content.w-sidebar #primary .entry-content > .wp-block-image > .alignright,
.site-content.w-sidebar #primary .page-content > .wp-block-image > .alignright {
  margin-right: 0;
}
.site-content.w-sidebar .sidenav {
  grid-area: sidenav;
  border-left: 1px solid var(--grey);
}

.blog .meat-potatoes,
.archive .meat-potatoes {
  max-width: var(--alignwide);
  margin: 0 var(--page-margin);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
  grid-gap: var(--gap);
}
@media screen and (min-width: 1529.6px) {
  .blog .meat-potatoes,
  .archive .meat-potatoes {
    margin-left: auto;
    margin-right: auto;
  }
}

.blog article.format-status .entry-content,
.archive article.format-status .entry-content {
  font-family: "Caveat", var(--font-primary);
  font-size: var(--font-size-2);
  line-height: 1.2;
  padding: 0 var(--gap);
}
.blog article.format-status .entry-header,
.archive article.format-status .entry-header {
  padding: 0 var(--gap) !important;
}

.blog .meat-potatoes > .post.format-status,
.archive .meat-potatoes > .post.format-status {
  background-color: transparent;
  background-image: none;
}
.archive.term-post-format-status .meat-potatoes {
  display: block;
  max-width: calc(var(--aligndefault) / var(--type-scale));
  margin-left: auto;
  margin-right: auto;
}
.archive.term-post-format-status .meat-potatoes > .post > .entry-header {
  margin-bottom: 0;
}

.single article.format-status .post-thumbnail,
.single article.format-status .entry-header,
.single article.format-status .entry-content {
  max-width: calc(var(--aligndefault) / var(--type-scale));
  margin-left: auto;
  margin-right: auto;
}
.single article.format-status .entry-header {
  margin-bottom: var(--gap);
}
.single article.format-status .entry-meta {
  font-family: "Caveat", var(--font-primary);
  font-size: var(--font-size-2);
  font-weight: bold;
}
.single article.format-status .entry-meta .posted-on {
  padding-left: 0;
}
.single article.format-status .entry-meta svg {
  display: none;
}
.single article.format-status .entry-content {
  font-family: "Caveat", var(--font-primary);
  font-size: var(--font-size-3);
  line-height: 1;
  /*
  padding-left: var(--page-margin);
  padding-right: var(--page-margin);
  */
}
@media screen and (max-width: 800px) {
  .single article.format-status .entry-content {
    font-size: var(--font-size-2);
  }
}

/* Primary Nav */
.main-navigation li.menu-item {
  margin: 0;
}
.main-navigation li.menu-item a {
  font-family: var(--font-secondary);
  font-size: var(--font-size-1);
  font-weight: 400;
}

.menu-primary-container > .nav-menu > li {
  padding-left: 0;
}
.menu-primary-container > .nav-menu > li::marker {
  content: "";
  color: unset;
}

/* Secondary Nav */
.subnav,
.children {
  list-style-type: none;
}
.subnav a,
.children a {
  display: block;
  color: var(--text);
  text-decoration: none;
  padding: calc(0.25 * var(--gap));
}
.subnav a:hover, .subnav a:focus,
.children a:hover,
.children a:focus {
  color: var(--link-hover-color);
  text-decoration: underline;
}

.subnav .children {
  margin: 0;
  padding-left: calc(0.75 * var(--gap));
}
.subnav .children li {
  border-bottom: 1px solid var(--grey-light-1);
  margin-bottom: 0;
}
.subnav .children .children li:last-child {
  border-bottom: none;
}

.subnav > li:first-child > a {
  font-size: var(--font-size-1);
  font-weight: bold;
  padding: 0;
}

.subnav .current_page_item > a {
  font-weight: bold;
}

/* Mobile Nav */
@media screen and (max-width: 600px) {
  .main-navigation > .menu-primary-container {
    z-index: 9;
  }
}
/* Icons, such as tags & categories */
.posted-on {
  position: relative;
  padding-left: 1.75em;
  display: block;
}
.posted-on svg {
  position: absolute;
  left: 0;
  top: 0;
  height: 1.25em;
  width: 1.25em;
}
.posted-on svg #cal-page-top,
.posted-on svg #cal-binder-left,
.posted-on svg #cal-binder-right,
.posted-on svg #cal-grid {
  fill: var(--link-color);
}

.tags-links {
  position: relative;
  padding-left: 1.5em;
  display: block;
}
.tags-links svg {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1em;
  width: 1em;
}
.tags-links svg path {
  fill: var(--turq-dark-1);
}

.cat-links {
  position: relative;
  padding-left: 1.5em;
  display: block;
}
.cat-links svg {
  position: absolute;
  left: 0;
  bottom: 2px;
  height: 1.139em;
  width: 1.395em;
}
.cat-links svg #check-bg {
  fill: #ffffff;
}
.cat-links svg #box {
  fill: var(--text);
}
.cat-links svg #checkmark {
  fill: var(--link-color);
}

/* Front Page */
.home #content {
  margin-top: calc(2 * var(--gap));
}

/* Blog and Archive pages */
.blog .meat-potatoes > .post,
.archive .meat-potatoes > .post {
  position: relative;
  padding: 0 calc(0.5 * var(--gap)) calc(0.5 * var(--gap));
  margin-bottom: var(--gap);
  background-color: #ffffff;
  background-image: linear-gradient(to bottom, var(--grey-light-1), #ffffff 175px);
  border-radius: calc(2 * var(--border-radius));
}
.blog .meat-potatoes > .post .post-thumbnail,
.archive .meat-potatoes > .post .post-thumbnail {
  padding-left: 0;
  padding-right: 0;
  margin: 0 calc(-0.5 * var(--gap));
  width: calc(100% + var(--gap));
}
.blog .meat-potatoes > .post .entry-header,
.archive .meat-potatoes > .post .entry-header {
  padding-left: 0;
  padding-right: 0;
  margin-bottom: calc(0.5 * var(--gap));
}
.blog .meat-potatoes > .post .entry-header a,
.archive .meat-potatoes > .post .entry-header a {
  text-decoration: none;
}
.blog .meat-potatoes > .post .entry-title,
.archive .meat-potatoes > .post .entry-title {
  margin-bottom: calc(0.25 * var(--gap));
}
.blog .meat-potatoes > .post .post-thumbnail + .entry-header .entry-title,
.archive .meat-potatoes > .post .post-thumbnail + .entry-header .entry-title {
  margin-top: calc(0.5 * var(--gap));
}
.blog .meat-potatoes > .post .entry-meta,
.archive .meat-potatoes > .post .entry-meta {
  font-size: var(--font-size-sm);
}
.blog .meat-potatoes > .post .entry-meta .posted-on,
.archive .meat-potatoes > .post .entry-meta .posted-on {
  padding-left: 1.25em;
}
.blog .meat-potatoes > .post .entry-meta svg,
.archive .meat-potatoes > .post .entry-meta svg {
  height: 0.9em;
  width: 0.9em;
  top: auto;
  bottom: 3px;
}
.blog .meat-potatoes > .post .entry-footer,
.archive .meat-potatoes > .post .entry-footer {
  padding-left: 0;
  padding-right: 0;
  margin-top: calc(0.5 * var(--gap));
  font-size: var(--font-size-sm);
}
.blog .meat-potatoes > .post .entry-footer a,
.archive .meat-potatoes > .post .entry-footer a {
  text-decoration: none;
}
.blog .meat-potatoes > .post .cat-links svg,
.archive .meat-potatoes > .post .cat-links svg {
  bottom: auto;
  top: 0;
}
.blog .meat-potatoes > .post .tags-links svg,
.archive .meat-potatoes > .post .tags-links svg {
  bottom: auto;
  top: 0.375em;
}
.blog .meat-potatoes > .post .comments-link,
.archive .meat-potatoes > .post .comments-link {
  display: none;
}

.sticky {
  border: 2px solid var(--red);
  border-bottom-width: 0;
}

.single .post .entry-meta,
.single .post .entry-footer {
  font-size: var(--font-size-sm);
}

/* Cards */
.wp-block-group.is-layout-flex.cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
  grid-gap: var(--gap);
}
.wp-block-group.is-layout-flex.cards > .wp-block-group {
  width: unset;
  max-width: unset;
}

.comment-list .children {
  border-left-color: var(--grey);
}
.comment-list .comment:not(:last-child) {
  border-bottom: var(--grey);
}

.comment-respond {
  border-top: 1px solid var(--grey);
}

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