/* 
Theme Name: Twenty Twenty Child 
Description: Twenty Twenty Child 
Theme Author: Tracy Durnell
Author URL: http://tracydurnell.com
Template: twentytwenty 
Version: 1.0.0 
Text Domain: twentytwenty-child 
*/

#hcard_widget p.p-name {font-size:2.25rem;font-weight: 700;line-height:2.75rem;text-align:center;}
.avatar {border-radius: 50%;}
.p-note {font-size:2rem;}
.hcard-display {width: 100%;
position: relative;
display: grid;
grid-template-columns: 20% 80%;
column-gap: 3rem;}
ul.hcard-properties {margin:0;}
#kind-menu .svg-icon {display:none;}

#kind-menu li {display:block;float:left;padding-right:2rem;margin-top:0;padding-top:1rem;}
#kind-menu ul {margin-left:0;}

.widget-content h2 {font-size:3rem;}
.wp-block-media-text__content p.has-large-font-size {font-size:2.25rem;font-weight:700;}

.wp-block-media-text__content p {font-size:2rem;}

.container {
  overflow: hidden;
}

div.container.alignwide {margin-top:0 !important;}

.container h3 {clear:both;}

#myBtnContainer {margin-bottom:0;}

.filterDiv {
	float: left; 
	text-align: center; 
	vertical-align: top;
	width: 250px; 
	min-height: 400px;
  display: none;
	/* Hidden by default */
}

.filterDiv img {margin-top:0;margin-bottom:0.5rem;}

/* The "show" class is added to the filtered elements */
.show {
  display: block;
}

/* Style the buttons */
.btn {
  border: none;
  outline: none;
  padding: 12px 16px;
  cursor: pointer;
	display:inline;
	margin-right:0.5rem;
	margin-bottom:0.5rem;
}

/* Add a light grey background on mouse-over */
.btn:hover {
  background-color: #000;
}

/* Add a dark background to the active button */
.btn.active {
  background-color: #666;
  color: white;
}

.widget-content .wp-block-media-text {margin-top:0;margin-bottom:0;}

.wp-block-media-text .wp-block-media-text__content {padding-left:2rem;padding-top:0;padding-bottom:0;padding-right:2rem;}

.dnf, .tbr {list-style: none;
	display: flex;
flex-wrap:wrap;
margin:0;}

.dnf li, .tbr li {margin: 0 6rem 6rem 0;
	padding:0;
flex:2 0 10em;}

.entry-content h3.first {margin-top:0;}

.entry-content h2.first {margin-top:0;}

.booktitle, .tracktitle {font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
	font-weight:700;
	font-size:18px;}

.taglist {
	column-width: 12em;
	column-gap: 2em;
}

.wp-block-categories {
	column-width: 10em;
	column-gap: 2em;
}

.entry-content h3.jobtitle {margin-bottom:0!important;margin-top:3rem!important;}
h6.jobdetails {margin-top:0.25rem;}

div.book {line-height:1.35;}

span.dt-accessed {font-size:1.5rem;}


/* updating pink text */
.widget .post-date, .powered-by-wordpress, .singular .entry-header .post-meta, .singular:not(.overlay-header) .entry-header .post-meta a, cite, figcaption, .wp-caption-text, .post-meta, .entry-content .wp-block-archives li, .entry-content .wp-block-categories li, .entry-content .wp-block-latest-posts li, .wp-block-latest-comments__comment-date, .wp-block-latest-posts__post-date, .wp-block-embed figcaption, .wp-block-image figcaption, .wp-block-pullquote cite, .comment-metadata, .comment-respond .comment-notes, .comment-respond .logged-in-as, .pagination .dots, .entry-content hr:not(.has-background), hr.styled-separator, :root .has-secondary-color  {color:#ea4b75!important;}

.to-the-top, body:not(.overlay-header) .toggle-inner .toggle-text {color:#e21249;}

.privacy-policy {color:black;}

a.privacy-policy-link {color:#6d6d6d;}

/* fixing look with pink background */
.response {border-bottom: inset 1px #ffb6b6;}

caption, thead *, tfoot * {background-color:#ea4b75;color:white;}

table caption {font-size:1.15em;}

table, table * {border-color:#ea4b75;}

.primary-menu > li > ul::after {border-bottom-color:#d6325e !important;}

.primary-menu ul ul::after {border-left-color:#d6325e !important;}

.primary-menu ul {background-color:#d6325e !important;}


/* detail expander */
details > summary {
	 cursor: pointer;
	color:#d40c41;
	font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
	font-weight:700;
	font-size:18px;
}

details > summary:hover {
	text-decoration:underline;
}

/* tracklist styling */
.tracktitle {
	font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
		font-size:18px;
	font-weight: 500;
	font-style:italic;
}

/* music and progress bar charts */
.year-meter, .book-progress {
  border: none;
  border-radius: 5px;
  overflow: hidden;
	max-height:30px;
}

.year-meter div, .book-progress div {
  font-family: sans-serif;
  font-weight: 700;
	font-size:10px;
	line-height:10px;
	padding-top:2px;
	padding-bottom:2px;
	padding-right:1px;
	padding-left:1px;
	display: flex;
  align-items: center;
  justify-content: center;}

.twentytwentytwo, .twentytwelve, .twothousandtwo, .ninetytwo, .two, .twelve, .feb, .dec, .newchap {background:#ea4b75;}
.twentytwentyone, .twentyeleven, .twothousandone, .eleven, .jan, .nov {background:#cf2e2e;}
.twentytwenty, .twentyten, .twothousand, .ninety, .ten, .oct {background:#BF6900;}
.twentynineteen, .twothousandnine, .ninetynine, .eightynine, .nine, .sept {background:#D67E23;}
.twentyeighteen, .twothousandeight, .eight, .aug, .edit {background:#fcb900;}
.twentyseventeen, .twothousandseven, .ninetyseven, .seven, .jul, .copyedit {background:#FCDC0D;}
.twentysixteen, .twothousandsix, .ninetysix, .eightysix, .six, .jun, .revised {background:#7bdcb5;}
.twentyfifteen, .twothousandfive, .five, .may {background:#2ACCDB;}
.twentyfourteen, .twothousandfour, .twentytwentyfour, .eightyfour, .four, .apr {background:#9EF8EE;}
.twentytwentythree, .twentythirteen, .twothousandthree, .thirtythree, .three, .mar {background:#f78da7;}

/* reading grid for yearly reading page and album library */
.month {
	display: flex;
	flex-wrap: wrap;
	gap: 6rem 3rem;
}

/* book grid for post features */
.books {
	display: flex;
	flex-wrap: wrap;
	gap: 3rem;
	justify-content: center;
	align-items:center;
}

.books div.book.show {
	width:150px;
	min-height:225px;
}

/* styling for album page */
.albums {
	display: flex;
	flex-wrap: wrap;
	gap: 8rem 3rem;
}

.album .p-name, .album .p-author {
		font-size:21px;
}

.album .p-name {	font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;font-weight: 700; text-wrap:balance;}

.albums div.album {width:275px; text-align:center;}

.album img {margin-bottom:1em;margin-top:0;}

.keytrack {background: rgba(255, 255, 255, 0.25);padding:0.35em 0.5em 0.35em 0.5em;border-radius:9px;display:block;line-height:1.25;max-width:225px;position:relative;left:25px;font-style:italic;inset-block:1rem;text-wrap:balance;}

/* text fixes */
td {word-break:keep-all !important;}

/* blogroll */
ul.blogroll {list-style:none;margin-left:0;}

ul.blogroll li {display:inline-block;background: rgba(255, 255, 255, 0.25);padding:0.25em 0.55em;margin:0.25em;border-radius:9px;position:relative;left:-0.25em;max-width:25ch;}

@media all and (min-width:800px) {
.two-column {
display: grid;
grid-template-columns: 1fr 1fr;
}
	
	.blogs {
	padding-right:1em;
}
	
	.blogs h4, .newsletters h4 {margin-top:0.5em;}
	
	h3.tight {margin-top:0;margin-bottom:0;}
	
	h2#explore {margin-top:-8rem;}
}

@media all and (max-width:800px) {
.two-column {display:block;}
.two-column h4 {margin-top:0;}
	h2#explore {margin-top:-4rem;}
}

/* extra styling */
article.type-post p:not(.specialexception) a:not([href*='tracydurnell.com']):not([href^='#']):not([href^='/']):not([href*='mailto']):not([href*='tel']):not([name]):after {
    content: "↗";
}

a.comment-reply-link {width:6ch;text-align:center;margin-bottom:2em;}

.terminology {text-decoration: dotted underline #D67E23; font-style:italic;}

dfn {text-decoration: dotted underline #D67E23; font-style:italic;}

.key {text-decoration: underline double #2ACCDB;}

.pullquote {
	border-image: linear-gradient(to left, #ea4b75 calc(50% - 8px), transparent calc(50% - 8px), transparent calc(50% + 8px), #ea4b75 calc(50% + 8px)) 1 / 1px 0 1px 0;
	display:block;
	width:70%;
	margin:auto;
	text-align:center;
	font-size:1.15em;
	padding-top:3rem;
	padding-bottom:3rem;
}

.pullquote::before, .pullquote::after {
	background: #ea4b75;
  content: "";
	display: block;
  height: 1.6rem;
  position: absolute;
  transform: rotate(22.5deg);
  width: 0.1rem;
}

.pullquote::before {
	left: calc(50%);
	margin-top:-4rem;
}

.pullquote::after {
		right: calc(50%);
		margin-top:2.25rem;
}

/* sidenotes */
.sidenote {background: rgba(255, 255, 255, 0.25);
	padding:0.5em 0.75em;
	border-radius:9px;
	font-size: 85%;
	color: #6d6d6d;
	list-style-type: none;
}

@media all and (min-width:1250px) {.sidenote {width:15em !important;}
}

@media all and (min-width:1000px) and (max-width:1249px) {	.sidenote{width:10em !important;}
}

@media all and (min-width:1000px)  {	.sidenote {position:absolute;
		margin:-5em 0 0 calc(50% + 31rem) !important;	
}
	
		li > aside.sidenote {
margin:-5em 0 0 32em !important;
	}
}

@media all and (max-width:999px) {    .sidenote {float: inherit;    position: inherit;
top:0;
width: calc(100%-4rem) !important;}
}

	/* recipe card */
.recipe-card {background: rgba(255, 255, 255, 0.25);
	padding:1em 1.25em;
	border-radius:18px;
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
gap:1em;}

.recipe-card img {border-radius:10px;height:225px;object-fit:cover;padding-bottom:0.5rem;margin-bottom:0;}

.recipe-card p {margin-bottom:0;}

.recipe a {font-size:1.25em;line-height:1.1em;}

.recipe {}

.recipe blockquote {font-size: 85%;border:none;margin-top:0;margin-bottom:1rem;	color: #6d6d6d;padding-top:0.5em;}

.recipe blockquote:before {content:"Notes:";font-style:italic;}

.recipe blockquote ul {margin-top:0;list-style-type:"- "}

.recipe ul {margin-bottom:1.25rem;list-style-type:circle;margin-left:0.25rem;margin-top:0.75em;font-size:0.95em;}

.recipe li {line-height:1.3em;}

.recipe ul a {font-size:2rem;color:#6d6d6d;}