/*
 Theme Name:   Can I Play Theme
 Description:  Custom for CIPT
 Author:       Marijn - ActiveB1t
 Author URI:   https://www.abitofaccess.com
 Version:      2.0.6
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  cipt
*/
@font-face { font-family: 'Atkinson'; font-style: italic; font-weight: 400; src: local(''), url('fonts/Atkinson-Hyperlegible-Italic-102a.woff2') format('woff2'), url('fonts/Atkinson-Hyperlegible-Italic-102.woff') format('woff'); font-display: swap; }
@font-face { font-family: 'Atkinson'; font-style: normal; font-weight: 400; src: local(''), url('fonts/Atkinson-Hyperlegible-Regular-102a.woff2') format('woff2'), url('fonts/Atkinson-Hyperlegible-Regular-102.woff') format('woff'); font-display: swap; }
@font-face { font-family: 'Atkinson'; font-style: italic; font-weight: 600; src: local(''), url('fonts/Atkinson-Hyperlegible-BoldItalic-102a.woff2') format('woff2'), url('fonts/Atkinson-Hyperlegible-BoldItalic-102.woff') format('woff'); font-display: swap; }
@font-face { font-family: 'Atkinson'; font-style: normal; font-weight: 600; src: local(''), url('fonts/Atkinson-Hyperlegible-Bold-102a.woff2') format('woff2'), url('fonts/Atkinson-Hyperlegible-Bold-102.woff') format('woff'); font-display: swap; }
@font-face { font-family: 'Raleway'; font-style: normal; font-weight: 400; src: local(''), url('fonts/raleway-v26-latin-regular.woff2') format('woff2'), url('fonts/raleway-v26-latin-regular.woff') format('woff'); font-display: swap; }
@font-face { font-family: 'Raleway'; font-style: normal; font-weight: 600; src: local(''), url('fonts/raleway-v26-latin-600.woff2') format('woff2'), url('fonts/raleway-v26-latin-600.woff') format('woff'); font-display: swap; }
@font-face { font-family: 'Raleway'; font-style: normal; font-weight: 900; src: local(''), url('fonts/raleway-v26-latin-900.woff2') format('woff2'), url('fonts/raleway-v26-latin-900.woff') format('woff'); font-display: swap; }
:root {
	--b1: 0.0625rem solid;
	--b2: 0.125rem solid;
	--g78: hsl(0,0%,78%);
	--g36: hsl(0,0%,36%);
	--g24: hsl(0,0%,24%);
	--g14: hsl(0,0%,14%);
	--sh: hsl(0,0%,0%,0.4);
	--p: hsl(182, 60%, 58%);
	--pp: hsl(260, 35%, 46%);
	--logo: #FFF;
	--rd: 0.625rem;
	--font: Raleway, sans-serif;
	--bg: hsl(0,0%,92%);
	--bg-f: hsl(225, 14%, 22%);
	--bg-c: #FFF;
	--bg-h: #FFF;
	--nv: var(--g14);
	--nv-c: #FFF;
	--nv-b: var(--b1) var(--g36);
	--cpy: var(--g78);
	--c: var(--g14);
	--f-c: var(--nv-c);
	--b: 0;
	--sft: var(--g36);
	--sft-b: var(--b1) var(--g78);
	--a: inherit;
	--a-i: inherit;
	--a-i-h: inherit;
	--g1: var(--blu);
	--g1-b: var(--b1) var(g1);
	--g2: var(--prp);
	--a-h: hsl(204, 88%, 35%);
	--fcs: hsl(260, 100%, 64%);
	--fcs-d: hsl(184, 70%, 55%);
	--btn: hsl(260, 35%, 46%);
	--btn-h: linear-gradient(120deg, hsl(260, 35%, 46%), hsl(260, 35%, 53%));
	--btn-c: #FFF;
	--btn-b: 0;
	--grn: hsl(182, 93%, 27%);
	--prp: hsl(260, 35%, 46%);
	--b2-g: var(--b2) var(--grn);
	--b2-p: var(--b2) var(--prp);
	--blu: hsl(204, 88%, 41%);
	--gry: var(--g36);
	--orn: hsl(24, 86%, 41%);
	--red: hsl(357, 100%, 46%);
	--shd: 0 0.0625rem 0.1875rem 0 var(--sh);
	--shd-h: 0 0.0625rem 0.375rem 0 var(--sh);
	--shd-i: inset 0 0 0.1875rem 0 var(--sh);
	--ptr: hsl(357, 100%, 63%);
	--ptr-h: linear-gradient(120deg, hsl(357,100%,63%), hsl(357,100%,70%));
	--twt: hsl(204, 88%, 41%);
	--twt-h: linear-gradient(120deg, hsl(204,88%,41%), hsl(204,88%,48%));
	--pay: hsl(211,53%,49%);
	--pay-h: linear-gradient(120deg, hsl(211,53%,49%), hsl(211,53%,55%));
	--pride: linear-gradient(90deg, hsl(0,100%,100%) 0%, hsl(330,100%,75%) 4%, hsl(210,100%,75%) 12%, hsl(30,45%,35%) 20%, hsl(0,100%,0%) 30%, hsl(0,100%,50%) 40%, hsl(60,100%,50%) 52%, hsl(120,100%,50%) 64%, hsl(180,100%,50%) 76%, hsl(240,100%,50%) 88%, hsl(300,100%,50%) 100%);
	--n1: 0 0 0.0625rem 0.0625rem;
	--n2: 0 0 0.125rem 0.0625rem;
	--n6: 0 0 0.375rem 0.125rem;
	--nn: var(--n1) hsl(188, 100%, 81%), var(--n6) hsl(195, 100%, 50%), var(--n6) hsl(193, 100%, 60%);
	--nn-prp: var(--n2) hsl(260deg 100% 89%), var(--n6) hsl(260deg 100% 64%);
	--nn-grn: var(--n2) hsl(182deg 93% 89%), var(--n6) hsl(182deg 93% 64%);
	--nn-blu: var(--n2) hsl(204deg 100% 89%), var(--n6) hsl(204deg 100% 64%);
	--nn-gry: var(--n2) hsl(0deg 0% 89%), var(--n6) hsl(0deg 0% 64%);
	--nn-orn: var(--n2) hsl(24deg 100% 89%), var(--n6) hsl(24deg 100% 64%);
	--nn-red: var(--n2) hsl(357deg 100% 89%), var(--n6) hsl(357deg 100% 64%);
	--nn-i: inset var(--n1) hsl(188, 100%, 81%);
	--nn-prp-i: inset var(--n2) hsl(260deg 100% 89%);
}
html.cipt-dark {
	--bg-c: hsl(204, 11%, 24%);
	--bg: hsl(204, 11%, 14%);
	--bg-h: hsl(204, 11%, 24%); 
	--c: hsl(204, 33%, 97%);
	--fcs: var(--fcs-d);
	--sft: var(--g78);
	--a-h: hsl(260, 64%, 75%);
	--g1: var(--fcs-d);
	--g2: var(--a-h);
}
html.cipt-contrast {
	--bg: hsl(41, 100%, 97%);
	--bg-c: var(--bg);
	--bg-f: var(--bg);
	--logo: #000;
	--nv-c: var(--a);
	--cpy: var(--c);
	--nv: var(--bg);
	--pride: var(--bg);
	--c: var(--g24);
	--f-c: var(--c);
	--sft: var(--c);
	--sft-b: var(--b1) var(--g36);
	--b: var(--b2) var(--g36);
	--a: var(--g14);
	--a-h: var(--g24);
	--a-i: var(--a);
	--a-i-h: var(--a-h);
	--g1: var(--c);
	--g2: var(--c);
	--btn: hsl(0, 10%, 83%);
	--btn-h: var(--btn);
	--btn-c: var(--g14);
	--btn-b: var(--b2) var(--g14);
	--shd: none;
	--shd-h: none;
	--shd-i: none;
	--grn: var(--bg);
	--prp: var(--bg);
	--blu: var(--bg);
	--gry: var(--bg);
	--orn: var(--bg);
	--red: var(--bg);
	--ptr: var(--btn);
	--twt: var(--btn);
	--nn: 0;
	--nn-prp: 0;
	--nn-grn: 0;
	--nn-blu: 0;
	--nn-gry: 0;
	--nn-orn: 0;
	--nn-red: 0;
	--nn-i: 0;
	--nn-prp-i: 0;
}
html.cipt-dark.cipt-contrast {
	--bg: #000;
	--logo: #FFF;
	--c: #FFF;
	--sft-b: var(--b1) hsl(0, 0%, 65%);
	--a: hsl(240, 100%, 75%);
	--a-h: hsl(268, 95%, 85%);
	--fcs: hsl(55, 100%, 60%);
	--btn: var(--g36);
	--btn-c: var(--fcs);
	--btn-b: var(--b2) var(--fcs);
}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { border: 0; font: inherit; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; }
html { overflow-y: scroll; -webkit-font-smoothing: auto; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -ms-high-contrast-adjust: none; forced-color-adjust: none; font-size: 100%; scroll-behavior: smooth; }
html, body { background-color: var(--bg); height: 100%; }
html.cipt-large { font-size: 200%; }
div#page { min-height: 100%; }
* { -webkit-box-sizing: border-box; box-sizing: border-box; }
*::-webkit-scrollbar { width: 0.8rem; }
*::-webkit-scrollbar-thumb { min-height: 3rem; background-color: var(--sft); border-radius: var(--rd); }
address, article, aside, details, figcaption, figure, footer, header, main, nav, section { display: block; }
embed, iframe, object, video { max-width: 100%; }
.clearfix::after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }
body, button, input, select, textarea { color: var(--c); font-family: 'Atkinson', sans-serif; font-size: 1.05rem; line-height: 1.4em; word-wrap: break-word; }
a, a:visited { color: var(--a); }
a, a:visited, a:focus, a:active, a:hover { text-decoration: none; }
a[target="_blank"]:after { content: ""; display: inline-block; width: 1em; height: 1em; overflow: hidden; vertical-align: sub; margin-left: 0.25rem; background-image: url(img/external.svg); background-repeat: no-repeat; background-size: 1em; background-position: top left; }
.cipt-dark a[target="_blank"]:after { filter: brightness(1.5); }
a img { border: 0; }
a:focus-visible, input:focus, textarea:focus, select:focus, button:focus, .focus, summary:focus-visible { outline: 0.1875rem solid var(--fcs); outline-offset: 0.1875rem; }
#site-navigation *:focus-visible, #site-navigation *:focus, footer *:focus-visible, footer *:focus { outline-color: var(--fcs-d); }
svg.logo { height: 1em; fill: var(--logo); color: var(--p); }
svg.large_logo { fill: var(--g14); color: var(--pp); }
.cipt-dark svg.large_logo, footer svg.large_logo { fill: var(--logo); color: var(--p); }
footer svg.large_logo { display: block; height: 3.5rem; width: 100%; margin: 3rem auto; }
h1, h2, h3, h4, h5, h6 { font-size: 2.6rem; padding-bottom: 1.25rem; color: var(--c); font-weight: 600; font-family: var(--font); line-height: 1.2; text-wrap: balance; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.3rem; }
h4 { font-size: 1.1rem; }
h5, h6 { font-size: 1rem; }
p, address, form { margin-bottom: 1rem; }
strong, b, th, dt { font-weight: 600; }
cite, em, i, address, .disclaimer { font-style: italic; }
sup, sub { font-size: 0.625rem; height: 0; line-height: 1; position: relative; vertical-align: baseline; }
sup { bottom: 1ex; }
sub { top: 0.5ex; }
table { border-collapse: collapse; border-spacing: 0; margin: 0 0 1.5em; width: 100%; }
th, td { border: var(--sft-b); padding: 0.325rem 0.625rem; }
caption, th, td { text-align: left; }
ul { list-style: none; }
ol { list-style: decimal; }
li > ul, li > ol { margin: 0 0 0 0.625rem; }
p, li { max-width: 80ch; }
pre { margin-bottom: 1.25rem; overflow: auto; padding: 1.25rem; border: var(--sft-b); }
pre, code, kbd, var, samp, tt { font-family: "Courier 10 Pitch",Courier,monospace; font-size: 0.9rem; line-height: 1.4; white-space: pre-wrap; }
abbr, acronym, dfn { border-bottom: 0.0625rem dotted var(--sft); cursor: help; }
ins { background: hsl(0,0%,0%,0.1); }
hr { border: 0; border-top: var(--sft-b); height: 0; margin: 2rem 4rem; }
dt { margin-bottom: 0.375rem; }
dd { margin-bottom: 1.5rem; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; display: block; clear: both; }
blockquote, q { quotes: "" ""; }
blockquote, .wp-block-pullquote blockquote, .wp-block-quote, .wp-block-quote.is-style-large { width: 100%; margin: 2rem auto; background-color: transparent; color: var(--g1); padding: 0 1rem; text-align: center; border-top: var(--g1-b); border-bottom: var(--g1-b); }
blockquote p, .wp-block-pullquote blockquote p, .wp-block-quote p, .wp-block-quote.is-style-large p { font-family: var(--font); font-weight: 600; font-size: 1.2em; line-height: 1.6; position: relative; padding: 1rem; }
blockquote a { color: var(--a-i); text-decoration: underline; }
blockquote a:hover { color: var(--a-i-h); }
blockquote cite, .wp-block-pullquote blockquote cite, .wp-block-quote cite, .wp-block-quote.is-style-large cite, .wp-block-quote__citation, .wp-block-quote footer { color: var(--c); font-size: 0.8rem; position: relative; top: -1.4rem; margin: 0; font-style: normal; float: right; }
blockquote:has(cite a[href*="x.com/"], cite a[href*="twitter.com/"], cite a[href*="linkedin."]) p { padding: 0 1rem 1rem; text-align: left; text-wrap: balance; }
blockquote:has(cite a[href*="x.com/"], cite a[href*="twitter.com/"], cite a[href*="linkedin."]) p:first-of-type:before { content: ""; display: inline-block; position: absolute; top: 0; left: -1.5rem; width: 1.5rem; height: 1.5rem; -webkit-mask-image: url(img/social/x.svg); mask-image: url(img/social/x.svg); background-color: currentColor; opacity: 0.5; }
blockquote:has(cite a[href*="linkedin."]) p:first-of-type:before { -webkit-mask-image: url(img/social/linkedin.svg); mask-image: url(img/social/linkedin.svg); }
figure.wp-block-pullquote { margin: 0; border: 0; padding: 0; text-align: left;}
.visually-hidden { position: absolute; height: 0.1rem; width: 0.1rem; overflow: hidden; clip: rect(0.1rem, 0.1rem, 0.1rem, 0.1rem); white-space: nowrap; background-color: var(--bg-c); color: var(--c); }
.skip-link { background-color: var(--bg-c); color: var(--c); border: 0; display: block; font-size: 0.9rem; text-decoration: none; font-weight: 600; line-height: normal; padding: 1rem 1.5rem 0.9rem; top: -10rem; left: 0.325rem; position: absolute; word-wrap: normal; }
.skip-link:focus { border: var(--b); border-radius: var(--rd); box-shadow: var(--shd-h); top: 0.325rem; z-index: 100000; }
input[type="text"], input[type="email"], input[type="search"], textarea { -webkit-appearance: none; appearance: none; height: 3rem; padding: 0.25rem 3.325rem 0.25rem 0.625rem; line-height: 1.25rem; width: 95%; margin: 0 0 2rem; color: #000; background-color: #FFF; box-shadow: var(--shd-i); border: var(--btn-b); border-radius: var(--rd); }
button { -webkit-appearance: none; appearance: none; margin-bottom: 1.875rem; padding: 0.3125rem 0.625rem; color: var(--btn-c); background: var(--btn); border-radius: var(--rd); font-size: 1rem; border: var(--btn-b); cursor: pointer; display: inline-block; }
nav form { margin: 0.5rem 0.5rem 0.5rem 0; }
nav form input[type="search"] { min-width: 15rem; margin: 0; }
nav.main-small-navigation form input[type="search"] { min-width: 10rem; }
nav form button { font-size: 1.75rem; margin-bottom: 0; height: 2.5rem; width: 2.5rem; padding: 0; margin-left: -3rem; margin-top: 0.25rem; vertical-align: top; }
svg.icon { width: 1em; height: 1em; vertical-align: middle; margin: 0 0.5rem 0.125rem 0; }
button svg.icon { margin: 0; }
/* Menu */
nav li > ul, nav li > ol { margin: 0; list-style: none; }
#site-navigation { width: 100%; box-shadow: var(--shd); position: relative; background-color: var(--nv); z-index: 999; padding: 0; }
.pride:after, .pride_top:before { background: var(--pride); content: ""; display: block; height: 0.125rem; width: 100%; border-top: var(--nv-b); visibility: visible; }
#site-navigation .inner-wrap { position: relative; }
.main-navigation { width: 100%; }
nav, nav a, nav a:visited { color: var(--nv-c); }
nav li { float: left; position: relative; padding: 0 0.8rem 0 0; }
nav a, nav li > span, nav li > label { display: block; float: none; height: 2rem; line-height: 2rem; font-size: 1rem; font-family: var(--font); margin: 0.7rem 0 0.3rem; }
nav a { display: inline-block; width: auto; text-decoration: none; }
.home-icon { float: left; width: 5rem; height: 2rem; line-height: 2rem; font-size: 1.25rem; text-align: center; border-radius: var(--rd); padding: 0; margin: 0.5rem 1rem 0 0; transition: 0.3s; }
.home-icon svg { height: 0.9em; width: 3em; margin-top: 0.5rem; }
nav a:hover, .current-menu-item > a, .current_page_ancestor > a, .current-menu-ancestor > a, .current_page_item a, nav li:hover > a, nav li:focus > a, .menu-toggle:hover { color: var(--nv-c); }
nav ul.nav-right { float: right; }
nav ul li ul { position: absolute; left: -9999rem; z-index: 100; width: auto; background-color: var(--nv); border-radius: 0 0 var(--rd) var(--rd); border: var(--nv-b); border-top: 0; box-shadow: var(--shd); }
nav ul li ul li { float: none; padding: 0 0.625rem; }
nav ul li ul li a { float: none; text-align: left; white-space: nowrap; }
nav ul li:hover > ul, nav ul li:focus > ul, nav ul li:focus-within > ul, nav ul li.focus > ul { left: auto; }
.menu-toggle, .menu-toggle:hover, .menu-toggle:focus { position: absolute; right: 0.5rem; color: var(--nv-c); padding: 0.5rem; background: none; }
button.menu-toggle svg.icon { font-size: 1.6rem; vertical-align: middle; color: var(--nv-c); margin: 0 0 0 0.5rem; }
.main-small-navigation div#menu-container { padding: 0 0 1rem 0; overflow-y: scroll; width: 100%; }
.main-small-navigation .menu-item-has-children > a:after { content: unset; }
.main-small-navigation ul, .main-small-navigation li { width: 100%; float: none; position: relative; left: auto; margin: 0; border: 0; box-shadow: none; }
.nav-right > li:last-child { padding: 0; }
.nav-right > li > span, .nav-right > li > label { background: var(--btn); color: var(--btn-c); font-size: 0.9em; border-radius: 0.9rem; border: var(--btn-b); font-weight: 600; padding: 0 0.625rem; }
.nav-right > li:hover > ul, .nav-right > li:focus, .nav-right > li:focus-within > ul { left: auto; right: 0; }
.main-small-navigation .nav-right > li > span, .main-small-navigation .nav-right > li > label { background: none; color: var(--nv-c); margin: 1rem 0 0 0; padding: 0 1rem 0 0; border: 0; }
/* Preferences */
.toggle { display: block; width: max-content; white-space: nowrap;  height: 2rem; line-height: 2rem; font-size: 0.9rem; padding: 0.25rem 0; color: var(--btn-c); box-sizing: content-box; cursor: pointer; }
.toggle span:first-of-type { float: left; box-sizing: content-box; width: 2rem; height: 1rem; padding: 0.25rem; margin: 0 0.9rem 0 0; background-color: var(--g36); border: var(--btn-b); border-radius: 0.75rem; transition: background-color .3s; }
.toggle span:first-of-type:before { float: left; content: " "; box-sizing: border-box; height: 1rem; width: 1rem; background-color: var(--btn-c); border-radius: 50%; transition: transform .3s; }
.toggle input:checked + span { background-color: var(--blu); }
.toggle input:checked + span:before { content: " "; transform: translateX(1rem); }
.toggle input:focus + span, .toggle:hover input + span { background: var(--a-h); }
.toggle input, .toggle input:focus { appearance: none; -webkit-appearance: none; float: left; width: 0; height: 0; margin: 0; border: 0; outline: 0; }
figure { margin: 0 0 1em 0; text-align: center; }
figcaption { font-size: 0.8rem; padding: 0.5em 0; }
img { max-width: 100%; height: auto; vertical-align: top; margin-bottom: 1.125rem; }
.article-content img, .widget img { max-width: 100%; width: 100%; }
.alignleft { display: inline; float: left; margin-right: 2rem; }
.alignright { display: inline; float: right; margin-left: 2rem; }
.aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; }
.wp-caption { border: var(--sft-b); margin-bottom: 1.5rem; max-width: 100%; }
.wp-caption img[class*="wp-image-"] { display: block; margin: 1.2% auto 0; max-width: 98%; }
.wp-caption-text { text-align: center; }
.wp-caption .wp-caption-text { margin: 0.8075rem 0; }
/* Titles */ 
.cipt-title { border-bottom: var(--b2-g); font-size: 1.6rem; color: var(--c); background-color: var(--bg); width: 100%; padding: 0.375rem 0; margin: 0 0 2rem 0; }
.cipt-title a { text-decoration: none; }
.article-content .cipt-title { border: 0; }
.secondary .cipt-title { text-align: right; }
/* Aspect ratios */
.wp-embed-aspect-16-9 > .wp-block-embed__wrapper { aspect-ratio: 16 / 9; }
.wp-embed-aspect-16-9 > .wp-block-embed__wrapper > iframe { width: 100%; height: 100%; }
img.size-cipt-box-art, img.avatar, img.size-cipt-profile { width: 100%; margin: 0; padding: 0; aspect-ratio: 3 / 4; }
img.avatar, img.size-cipt-profile { aspect-ratio: 1 / 1; }
/* Widgets */
.secondary .widget { margin-bottom: 2.25rem; }
/* Header */
a.header_logo { display: block; width: 42%; margin: 0 auto; padding: 1rem 0; }
a.header_logo svg { width: 100%; height: auto; }
#header-text-nav-container { background-color: var(--bg-h); }
/* Content */
main, .inner-wrap { margin: 0 auto; max-width: 72rem; width: 96%; }
main { padding: 2rem 0 1.25rem; background-color: var(--bg); max-width: 73rem; display: flex; flex-direction: row; flex-wrap: wrap; }
main > div, main > section { flex: 1 1 100%; width: 100%; margin: 0 0.5rem; }
.primary { flex-basis: 0%; min-width: 70%; max-width: 50rem; }
.secondary { flex-basis: 26%; }
#content .post { box-shadow: var(--shd); background-color: var(--bg-c); border: var(--b); border-radius: var(--rd); margin-bottom: 2rem; overflow: hidden; }
#content .post img { margin-bottom: 0; }
#content .post .article-content { padding: 1rem 2rem 2rem 2rem; margin: 0; }
.article-content ol, .article-content ul { list-style-position: outside; margin: 0 0 2rem 1rem; }
.article-content ul { list-style: square; }
.article-content li > ol, .article-content li> ul { margin: 0 0 0 1rem; }
.article-content a { text-decoration: underline; text-underline-offset: 0.2rem; text-decoration-thickness: 0.125rem; text-decoration-color: var(--a-h); transition: color 0.2s; }
.article-content a:hover { color: var(--a-h); text-decoration: none; }
.article-content a.def { text-decoration-style: dotted; }
.post .article-content h2, .post .article-content h3, .post .article-content h4, .post .article-content h5, .post .article-content h6 { margin: 1.5em 0 0.75em; padding: 0; background-color: var(--bg-c); font-weight: bold; letter-spacing: 0.02em; }
h2:target:before, h3:target:before, h4:target:before, h5:target:before, h6:target:before { content: ""; display: block; height: 4rem; margin: -4rem 0 0; }
/* Custom blocks */
aside.wp-block-blocks-aside-block { font-family: var(--font); font-weight: 900; margin: 3rem 0; }
aside.codex-aside { font-weight: 600; }
aside.codex-aside:not(:first-of-type) { margin: 1rem 0; }
figure.spoiler > div { position: relative; overflow: hidden; }
figure.spoiler img { vertical-align: bottom; filter: blur(0.75rem) grayscale(50%); transition: 0.4s ease-in-out; }
figure.spoiler button { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 3rem; width: 10rem; margin: auto; }
figure.nospoiler img { filter: none; }
figure.nospoiler button { display: none; }
/* Previous / Next */
.default-wp-page { clear: both; margin: 2rem 0 4rem; }
.previous { float: left; }
.next { float: right; }
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color: hsl(0,0%,0%,0.1); }
/* Definitions */
section.definitions { padding: 2rem 0 4rem; }
section.definitions dl { display: flex; flex-wrap: wrap; gap: 2rem; }
section.definitions dl > div { flex: 0 1 calc(50% - 1rem); min-width: 20rem; box-shadow: var(--shd); background-color: var(--bg-c); border: var(--b); border-radius: var(--rd); padding: 1rem 2rem 2rem 2rem; display: flex; flex-wrap: wrap; align-content: baseline; }
section.definitions dl > div > dt { font-size: 0.8em; color: var(--sft); }
section.definitions dl > div > dt + dt:nth-of-type(2):before { content: 'Also known as:'; padding: 0 1ch 0 0; }
section.definitions dl > div > dt + dt:not(:last-of-type):after { content: ','; padding: 0 1ch 0 0; }
section.definitions dl > div > dt:first-of-type { flex: 0 0 100%; order: -1; font-weight: 600; font-family: var(--font); color: var(--c); line-height: 1.2; font-size: 1.25em; padding: 0.25rem 0 1rem 0; }
section.definitions dl > div > dd { flex: 0 0 100%; order: -1; }
/* Socials */
.socials { text-align: center; clear: both; }
.secondary .socials { width: 90%; margin: 0 auto; }
.socials form { display: inline; margin: 0; padding: 0; }
.socials p { margin: 1rem auto; font-size: 0.8rem; }
.socials p a { display: inline; font-size: 1em; }
.socials > a, .socials > a:hover, .socials button, .socials button:hover { display: inline-block; vertical-align: top; box-sizing: content-box; text-align: center; background: var(--btn); color: var(--btn-c); border: var(--btn-b); border-radius: 50%; }
.cipt-author .socials a { margin: 0.5rem 0.2rem 0; width: 1.6rem; height: 1.6rem; line-height: 1.6rem; font-size: 1.125rem; padding: 0.2rem; }
.secondary .socials a, footer > .socials > a, .secondary .socials button, footer > .socials button {  margin: 0.5rem 0.25rem 0; width: 2.4rem; height: 2.4rem; line-height: 2.4rem; font-size: 1.6rem; padding: 0.4rem; }
.socials a svg, .socials button svg { margin: 0; }
/* Footer */
footer { font-size: 0.9rem; line-height: 1.4; border-top: var(--nv-b); background-color: var(--bg-f); padding: 0 0 2rem 0; }
footer > .footer_widgets { width: 96%; max-width: 72rem; margin: 2rem auto; display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; gap: 1rem; }
footer > .footer_widgets > .widget { flex: 1 0 31%; min-width: 18.75rem; color: var(--f-c); padding: 2rem 1rem; border-radius: var(--rd); background-color: var(--nv); box-shadow: var(--shd); margin: 0; text-align: center; }
footer > .footer_widgets > .widget h2 { font-size: 1.125rem; line-height: 1.5em; color: var(--f-c); }
footer > .footer_widgets form { width: 100%; text-align: left; }
footer > .footer_widgets label { width: 4rem; display: inline-block; text-align: right; padding: 0 0.5rem 0 0; }
footer > .footer_widgets input[type="email"] { margin: 0; line-height: 1.75rem; width: calc(100% - 5rem); }
footer > .footer_widgets button { margin: 0 0 0 -5.5rem; font-size: 0.9rem; width: 5rem; padding: 0; height: 2.5rem; }
footer > div.copy { color: var(--cpy); text-align: center; }
footer > div.copy svg { height: 0.7em; width: 3em; margin-right: 0.625rem; }
footer > div.copy a { color: var(--a-i); text-decoration: underline; }
footer > div.copy a:hover { color: var(--a-i-h); }
footer > .socials { margin: 0 0 2rem 0; color: var(--cpy); }
/* To Top */
a#to-top { bottom: 1.25rem; position: fixed; right: 1.25rem; color: var(--a); border: var(--btn-b); font-size: 2.5rem; line-height: 2.5rem; display: none; opacity: 0.5; z-index: 999; }
a#to-top svg.icon { margin: 0; }
a#to-top:hover { opacity: 1; }
/* Button & ad widgets */
.cipt_ad_widget { text-align: center; }
.widget_cipt_ad_widget a { display: block; margin: 1.25rem 0 0 0; padding: 0; }
.widget_cipt_ad_widget a img { margin: 0; border: var(--btn-b); border-radius: var(--rd); box-shadow: var(--shd); }
.cipt_button_widget .btn { display: inline-block; padding: 1rem; background: var(--ptr); color: var(--btn-c); text-decoration: none; font-weight: bold; font-size: 1.2rem; line-height: 1.2rem; margin: 0.5rem auto; border: var(--btn-b); border-radius: var(--rd); box-shadow: var(--shd); }
.cipt_button_widget .btn:hover { color: var(--btn-b); background: var(--ptr-h); }
.cipt_button_widget .btn.twitter, a.share_twitter { background: var(--twt); }
.cipt_button_widget .btn.twitter:hover, a.share_twitter:hover { background: var(--twt-h); }
.cipt_button_widget .btn.paypal { background: var(--pay); }
.cipt_button_widget .btn.paypal:hover { background: var(--pay-h); }
.cipt_button_widget .btn svg { display: inline-block; width: 1.2rem; height: 1.2rem; margin: 0 1rem 0 0; fill: var(--btn-c); vertical-align: top; }
a.share_twitter { float: right; color: var(--btn-c); font-size: 0.9rem; border-radius: 0.7rem; border: var(--btn-b); padding: 0.125rem 0.625rem 0; margin: 0 2rem 0 0; }
article .widget h2 { margin: 0; clear: both; }
article .widget p { font-size: 0.9rem; clear: both; }
article .widget_cipt_paypal_widget form { float: left; margin: 0; } 
article .cipt_button_widget .btn { float: left; margin: 0.5rem 1rem 0.5rem auto; }
article section.widget_cipt_button_widget.clearfix::after, article section.widget_cipt_paypal_widget.clearfix::after { clear: none; }
/* Progress bar */
div#progress_bar { display: none; width: 100%; height: 0.1875rem; margin: 0 0 -0.1875rem 0; background-color: transparent; }
.cipt-progress body.single div#progress_bar, .cipt-progress body.page div#progress_bar { display: block; }
div#progress_bar div { width: 0%; height: 100%; background-color: var(--fcs); transition: 0.3s; }
/* Scores */
.cipt-scores { width: 100%; margin: 1rem auto 0 auto; }
#after-cipt-scores { height: 3rem; border-top: var(--sft-b); }
.cipt-score-disclaimer { border-top: var(--g1-b); padding: 1rem 0 0 0; font-size: 0.8rem; }
.cipt-scores h2, h2#after-cipt-scores { font-size: 1.75em; }
.score-row { display: flex; justify-content: space-between; align-items: center; gap: 2rem; padding: 0 0 1rem; border-bottom: var(--g1-b); }
.score-row:last-of-type { align-items: stretch; }
.score-summary { flex: 1 1 75%; }
.score-summary span.aspect { font-size: 1em; padding-right: 1rem; color: var(--sft); }
.article-content .score-summary h2, .score-summary p { padding: 1rem 0; margin: 0; }
.score-total { flex: 1 1 auto;  text-align: center; }
.score-total h3 { font-size: 1.2rem; padding: 0.5rem 0; font-weight: 900; letter-spacing: 0.1rem; }
.score-total span { font-family: var(--font); font-weight: 900; font-size: 3rem; line-height: 2rem; }
.score-total span.incr { font-size: 1.5rem; vertical-align: super; }
.score-total small { line-height: 2rem; font-weight: 600; font-size: 0.9rem; display: block; }
.pro-con { flex: 1 1 50%; }
.article-content .pro-con > h3 { font-size: 1.2rem; margin: 0 0 0.5em; }
ul.pro, ul.con { list-style-type: none; margin: 0; }
ul.pro li, ul.con li { margin: 0 0 0.5rem 1.5rem; }
ul.pro li:before, ul.con li:before { content: "+"; display: inline-block; width: 1.2rem; height: 1.2rem; line-height: 1.2rem; font-size: 1.6rem; font-family: var(--font); font-weight: 600; background-color: var(--bg); color: var(--c); border-radius: 50%; text-align: center; vertical-align: middle; position: relative; left: -1.5rem; margin: 0 -1.2rem 0 0; }
ul.con li:before { content: "−"; }
/* Author */
.cipt-author { padding: 2rem 1rem; display: flex; flex-wrap: nowrap; align-items: stretch; justify-content: space-between; gap: 1rem; }
.cipt-author > div { flex: 1 1 75%; }
.cipt-author > div:first-child { max-width: 25%; }
.cipt-author img { width: 100%; border-radius: var(--rd); }
span.role { display: block; font-size: 1.2rem; color: var(--c); padding-right: 7rem; }
span.pronouns { float: right; margin-top: -1.2rem; font-size: 1rem; color: var(--c); }
.cipt-author p { padding: 0.5rem 0; margin: 0; }
/* Category links */
.cards div.cat-meta { margin: 0.375rem 1rem 0; }
.post header div.cat-meta { margin: 1rem 2rem 0 2rem; }
.cat-meta { font-size: 0.75rem; }
.cat-meta a, .cat-meta span { border-bottom: var(--b2-g); color: var(--c); margin: 0 1rem 0 0; padding: 0.25rem 0.125rem; line-height: 1.37; display: inline-block; transition: border-color 0.5s; }
.cat-meta a:after { display: block; width: 0; height: 0; content: ' '; position: relative; top: 0.25rem; box-shadow: var(--nn-grn); margin: 0 auto; opacity: 0; transition: width 0.5s, opacity 0.2s; }
.cat-meta a:hover { border-color: var(--bg-c); }
.cat-meta a:hover:after { width: 100%; opacity: 1; }
/* Chonky titles */
.post header h1, .cipt-author h1, .cipt-author h2, .cipt-scores h2, h2#after-cipt-scores { color: var(--g1); font-weight: 900; letter-spacing: 0.025rem; padding: 0 0 0.5rem 0; }
h2#after-cipt-scores { padding: 2rem 0; }
.cipt-author h1, .cipt-author h2 { font-size: 2rem; }
@supports (-webkit-background-clip: text) {
	.post header h1, .cipt-author h1, .cipt-author h2, blockquote p, .cipt-scores h2, .score-total, h2#after-cipt-scores { background: linear-gradient(170deg, var(--g1), var(--g2)); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
}
.main-navigation .nav-right > li:hover > span, .main-navigation .nav-right > li:hover > label, button:hover, .socials > a:hover { background: var(--btn-h); }
/* Shortcode Author */
.post .article-content .cipt-author { display: block; padding: 2rem 0; margin: 0; clear: both; }
.post .article-content .cipt-author div:first-child { float: left; margin: 0 1rem 1rem 0; }
.post .article-content .cipt-author h2 { margin-top: 0; border: 0; }
/* Features */
details.post summary { font-size: 1.75rem; margin: 1rem; padding: 0; }
details.post summary h2 { font-size: 1em; display: inline; }
.post .tags, .card .tags { background-color: var(--bg); box-shadow: var(--shd-i); font-size: 0.8em; padding: 0.5rem 0.5rem 0 0.5rem; border: var(--b); border-radius: var(--rd); margin: 1rem; }
details.post .tags { margin-top: 0; }
.card .tags { margin: 1rem 0.5rem 0 0.5rem; }
.tags h2, .card .tags h2, .card .tags h3, .card .tags h4 { font-size: 1em; padding: 0.25rem 0 1rem 0; margin: 0; border: 0; }
.post .tags h2, .post .tags h3 { font-size: 1.5em; }
.post .tags h3:not(:first-of-type) { padding-top: 0.5rem; border-top: var(--b1) var(--sh); }
.post .tags h4 { font-size: 1.2em; }
.tags ul { padding: 0 0 0.5rem 0; }
.tags ul li { display: inline-block; }
.tags a, .tags li a { display: inline-block; margin: 0 0.5rem 0.5rem 0; padding: 0 0.5rem; border-radius: 0.5rem; background: var(--btn); color: var(--btn-c); line-height: 2em; }
.tags a:focus, .tags a:hover { background: var(--btn-h); }
.tags a.clear { float: right; font-size: 0.8rem; margin: 0; }
.card .ratings { margin: 0 1rem; }
.card .ratings a, .post .cipt-author .ratings a { display: inline-block; margin: 1rem 0.5rem 0 0; height: auto; border: 0; }
.post .cipt-author .ratings { padding: 0 0 0 5em; }
.card .ratings img { width: auto; height: 3rem; margin: 0; }
.post .ratings img { width: auto; height: 4rem; border-radius: 0; }
.selected a:after, .available a:after { content: '−'; display: inline-block; border-radius: 0.5em; width: 1em; height: 1em; margin-left: 0.5rem; line-height: 1em; text-align: center; font-size: 1.2em; background-color: var(--bg-c); color: var(--c); }
.available a:after { content: '+'; }
.card .links { font-size: 0.75rem; line-height: 1.5rem; margin: 0 1rem; padding: 0 0 0.5rem 0; }
.card .links a { border-bottom: var(--b2-p); color: var(--c); height: 1.5rem; display: inline-block; margin-right: 0.5em; transition: border-color 0.5s; }
.card h2.meta_title, .card h3.meta_title, .card h4.meta_title, .meta_title { flex: 1 1 6em; line-height: 1.5rem; padding: 0; margin: 0; font-size: 0.75rem; }
/* Codex navigation */
nav.sub { position: relative; top: -1.5rem; padding: 1.45rem 0 0; font-size: 0.9rem; font-weight: 600; color: var(--c); }
nav.sub a { display: inline-block; height: 1.5rem; line-height: 1.5rem; font-size: 1em; font-weight: normal; color: var(--c); margin: 0 0.25rem; border-bottom: var(--b2-p); transition: border-color 0.5s; }
/* Codex Details */
p.codex_descr { padding: 0 1rem; }
.link-columns { display: flex; justify-content: flex-end; align-items: flex-start; flex-wrap: wrap; margin: 1rem; }
.link-columns > div { flex: 1 1 25%; align-self: stretch; padding: 0 0 0 0.5rem; min-width: 12rem; }
/*.link-columns > div:first-child { flex: 0 0 25%; }*/
.link-columns h2 { font-size: 1rem; padding: 1rem 0 0.25rem 1em; }
.link-columns h3 { font-size: 0.9rem; padding: 0 0 0.25rem 1rem; }
.link-columns li > ul { margin: 0 0 0 0.25rem; }
.link-list { display: flow-root; }
.link-columns li, .link-list li { font-size: 0.9rem; padding: 0.25rem 0 0 0; }
.link-list .meta_title { font-size: 1em; }
.link-columns a, .link-list a { display: inline-block; height: 1.5rem; line-height: 1.5rem; text-transform: none; letter-spacing: 0; color: var(--c); border-bottom: var(--b2-p); margin-right: 0.5em; transition: border-color 0.5s; }
.link-columns a:first-child, .link-columns span:first-child { margin-left: 1.2em; }
.link-columns a svg { width: 1em; height: 1em; margin-left: -1.5em; opacity: 1; }
.link-list li, .card .links { display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; }
.link-list li span:last-child, .card .links span:last-child { flex: 1 1 calc(100% - 6em); }
/* Raise elements on hover */
.widget_cipt_ad_widget a:hover > img, a.btn:hover, button.btn:hover, input.btn:hover { filter: brightness(1.05); box-shadow: var(--shd-h); }
.widget_cipt_ad_widget a:active > img, a.btn:active, button.btn:active, input.btn:active { box-shadow: var(--shd-i); }
/* Cards */
.post header > div { margin: 0; padding: 0; }
.post header { margin-bottom: 1rem; }
.post header img { width: 100%; margin: 0; aspect-ratio: 16 / 9;}
.post header h1, .post header h2, .post header h3 { margin: 1rem 2rem; }
.post header .meta a, .article-content .meta a { color: var(--a-i); text-decoration: none; }
.post header .meta a:hover { color: var(--a-i-h); text-decoration: underline; text-decoration-thickness: 0.125em; text-underline-offset: 0.125em; }
.post header > div div { margin: 0.375rem 2rem 0; }
.post header .meta, .article-content .meta { font-size: 0.75rem; color: var(--sft); }
.post header span.meta { display: inline-block; margin: 0.375rem 0 0 2rem; }
.post header div.meta_block { margin: 0; padding: 0; }
ul.cards { list-style: none; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; margin: 0 0 2rem 0; }
ul.cards.featured { flex-wrap: nowrap; gap: 0.5rem; }
.cards.left { justify-content: flex-start; }
.cards li, .card { flex: 1 1 auto; max-width: 49%; align-self: stretch; background-color: var(--bg-c); box-shadow: var(--shd); padding: 0 0 1rem 0; border: var(--b); border-radius: var(--rd); overflow: hidden; margin: 0 0 2rem 0; display: flex; flex-flow: column nowrap; position: relative; transition: opacity 0.4s; }
.cards.three li { max-width: 32%; min-width: 32%; }
.cards.four li { max-width: 24%; min-width: 24%; }
.cards.left li { margin-right: 1%; }
.cards li img { width: 100%; margin: 0; aspect-ratio: 16 / 9; transition: filter 0.2s; }
.cards.games li img { aspect-ratio: 3 / 4;}
.cards.square li img { aspect-ratio: 1 / 1;}
.cards:hover img { filter: grayscale(0.5); }
.cards li:hover img { filter: grayscale(0); }
.cards li h2, .cards li h3, .card h2, .card h3 { margin: 1rem; padding: 0; font-size: 1.375rem; }
.cards li h2:last-child, .cards li h3:last-child { margin-bottom: 0; }
.cards li h2 a, .cards li h3 a, .cards li .meta a { color: var(--a-i); text-decoration: none; text-decoration-thickness: 0.125em; text-underline-offset: 0.125em; }
.cards li h2 a:hover, .cards li h3 a:hover, .cards li .meta a:hover, .card h2 a:hover, .card h3 a:hover { color: var(--a-i-h); text-decoration: underline; }
.cards p, .card p { margin: 0.375rem 1rem 1rem; font-size: 0.9rem; }
.cards li .meta { font-size: 0.75rem; color: var(--sft); margin: 0.375rem 0 0 1rem; display: inline-block; }
.cards li .meta_block { margin: auto 0 0 0; }
.cards li.list { display: flex; flex-flow: row; flex-wrap: wrap; align-items: center; max-width: 100%; padding: 0; }
.cards li.list img { width: 36%; min-width: 36%; }
.cards li.list h2, .cards li.list h3 { flex: 1 1 0; margin-bottom: 1.5rem; font-size: 1rem; }
.cards li.list .meta_block { flex: 0 0 60%; margin: -2rem 0 0 36%; height: 2rem; }
.cards.featured li { flex: 1 1 50%; max-width: unset; margin: 0; background: var(--bg-c); }
.cards.featured li h2, .cards.featured li h3, .cards.games li h2, .cards.games li h3 { font-size: 1rem; text-align: center; }
.cards.featured li img { transition: filter 0.2s; }
.secondary .cards li, .secondary .card { max-width: 100%; }
.secondary .cards li h2, .secondary .cards li h3, .card h3 { font-size: 1rem; }
.cards li h2 a:after, .cards li h3 a:after, .card h2 a:after, .card h3 a:after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.cards li:focus-within { outline: 0.1875rem solid var(--fcs); outline-offset: 0.1875rem; }
.cards li:focus-within a:focus-visible { outline: 0; text-decoration: underline; }
.cards div.cat-meta, .card .links, .card .ratings { z-index: 50; }
/* Neon */
.cards li img ~ h2 a:before, .cards li img ~ h3 a:before, .card img + h2 a:before, .card img + h3 a:before { display: block; width: 0%; position: relative; top: -1rem; margin: 0 auto; height: 0; content: ' '; box-shadow: var(--nn); transition: width 0.5s,opacity 0.7s; opacity: 0; }
.cards li img ~ h2 a:hover:before, .cards li img ~ h3 a:hover:before, .card img + h2 a:hover:before, .card img + h3 a:hover:before { width: 100%; opacity: 1; }
.cards li .cat-meta + h2 a:before, .cards li .cat-meta + h3 a:before { top: -3rem; }
.cards li.list h2 a:before, .cards li.list h3 a:before { display: inline-block; position: absolute; left: 36%; top: 50%; margin: 0; transition: height 0.5s,top 0.5s, opacity 0.7s; }
.cards li.list h2 a:hover:before, .cards li.list h3 a:hover:before { top: 5%; height: 90%; width: 0; }
.socials > a:after, .socials button:after { display: block; position: relative; top: -2.8rem; left: -0.4rem; width: 3.2rem; height: 3.2rem; margin: 0; content: ' '; border-radius: 50%; box-shadow: var(--nn-prp), var(--nn-prp-i); transition: opacity 0.7s; opacity: 0; }
.cipt-author .socials a:after { top: -1.8rem; left: -0.2rem; width: 2rem; height: 2rem; }
.socials > a:hover:after, .socials button:hover:after { opacity: 1; }
.previous a, .next a, .cipt-author > div:nth-child(2) a, .sticky-nav a { display: inline-block; color: var(--c); height: 1.5rem; line-height: 1.5rem; text-decoration: none; border-bottom: var(--b2-p); transition: border-color 0.5s; }
.previous a:after, .next a:after, .cipt-author > div:nth-child(2) a:after, .sticky-nav a:after, .link-columns a:after, .link-list a:after, .card .links a:after, nav a:after, .toggle:after { display: block; width: 0; height: 0; content: ' '; position: relative; top: -0.0625rem; box-shadow: var(--nn-prp); margin: 0 auto; opacity: 0; transition: width 0.5s, opacity 0.2s; }
.previous a:hover, .next a:hover, .cipt-author > div:nth-child(2) a:hover, .sticky-nav a:hover, .link-columns a:hover, .link-list a:hover, .card .links a:hover, nav.sub a:hover { color: var(--a-h); border-color: var(--bg); }
.previous a:hover:after, .next a:hover:after, .cipt-author > div:nth-child(2) a:hover:after, .sticky-nav a:hover:after, .link-columns a:hover:after, .link-list a:hover:after, .card .links a:hover:after, nav a:hover:after, .toggle:hover:after, .toggle:focus-within:after { width: 100%; opacity: 1; }
/* Navigation flyout */
nav.sticky-nav { margin: 0 0 2rem; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap;  }
nav.sticky-nav span { flex: 1 1 25ch; max-width: 100%; }
nav.sticky-nav span:first-child { flex: 0 0 100%; font-weight: 600; font-family: var(--font); }
nav.sticky-nav a, nav.sticky-nav a:visited { color: var(--c); font-size: 0.9rem; margin: 0.25rem 0; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
nav.sticky-nav a:after { top: -0.1825rem; }
@media screen and (min-width: 100em) {
	html:not(.cipt-large) nav.sticky-nav { position: fixed; left: 1.5rem; width: calc((100vw - 78rem)/2); top: 17rem; color: var(--c); text-align: right; margin: 0; }
	html:not(.cipt-large) nav.sticky-nav span { flex: 1 1 100%; }
}
/* Image compare focus fix */
div.jx-controller:focus { border: 0.25rem solid var(--fcs); background-color: var(--btn-c); box-shadow: 0 0 0 0.125rem var(--btn-c); }
/* Cookie bar */
div#cookie-bar { position: fixed; left: 0; bottom: 0; width: 100%; text-align: center; background-color: var(--bg-c); color: var(--c); z-index: 9999; }
div#cookie-bar button { margin: 0.5rem 2rem; }
.aria-ref, .menu-toggle, figure.nospoiler button, .cards li.list span.meta:nth-child(n+3), .updated:not(.published), .post .ratings a:after, img#wpstats { display: none; }
/* Responsive */
@media screen and (max-width: 50em) {
	html:not(.cipt-large) #logo-container, html:not(.cipt-large) .main-navigation ul, html:not(.cipt-large) .cards.featured li:nth-child(1n+5) { display: none; }
	html:not(.cipt-large) .menu-toggle { display: block; }
	.secondary .cipt-title { text-align: left; }
}
@media screen and (max-width: 100em) {
	html.cipt-large #logo-container, html.cipt-large .main-navigation ul, html.cipt-large .cards.featured li:nth-child(1n+5) { display: none; }
	html.cipt-large .menu-toggle { display: block; }
}
@media screen and (max-width: 36.25em) {
    html:not(.cipt-large) .cards li { max-width: 100%; }
	html:not(.cipt-large) .cards.four li { max-width: 49%; }
	html:not(.cipt-large) .cards.featured li:nth-child(1n+3) { display: none; }
}
@media screen and (max-width: 72.5em) {
    html.cipt-large .cards li { max-width: 100%; }
	html.cipt-large .cards.four li { max-width: 49%; }
	html.cipt-large .cards.featured li:nth-child(1n+3) { display: none; }
}
/* Accent colors */
.bg_green { background-color: var(--grn); }
.cat-meta *.brd_green, .brd_green { border-color: var(--grn); }
.cat-meta *.brd_green:after, .brd_green:after { box-shadow: var(--nn-grn); }
.bg_purple { background-color: var(--prp); }
.cat-meta *.brd_purple, .brd_purple { border-color: var(--prp); }
.cat-meta *.brd_purple:after, .brd_purple:after { box-shadow: var(--nn-prp); }
.bg_blue { background-color: var(--blu); }
.cat-meta *.brd_blue, .brd_blue { border-color: var(--blu); }
.cat-meta *.brd_blue:after, .brd_blue:after { box-shadow: var(--nn-blu); }
.bg_grey { background-color: var(--gry); }
.cat-meta *.brd_grey, .brd_grey { border-color: var(--gry); }
.cat-meta *.brd_grey:after, .brd_grey:after { box-shadow: var(--nn-gry); }
.bg_orange { background-color: var(--orn); }
.cat-meta *.brd_orange, .brd_orange { border-color: var(--orn); }
.cat-meta *.brd_orange:after, .brd_orange:after { box-shadow: var(--nn-orn); }
.bg_red { background-color: var(--red); }
.cat-meta *.brd_red, .brd_red { border-color: var(--red); }
.cat-meta *.brd_red:after, .brd_red:after { box-shadow: var(--nn-red); }
/* Print */
@media only print {
	.skip-link, #masthead, #to-top, .secondary, .related-posts-wrapper, .cipt_patreon_post, .cipt-author > *:not(h2):not(p), #cookie-bar { display: none !important; }
	.primary { width: 100% !important; }
	* { background-image: none !important; background-color: #FFF !important; border-color: #000 !important; color: #000 !important; box-shadow: none !important; }
}
*[data-youtube-facade] { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; margin: 0; padding: 0; border: 0; border-radius: 0; }
*[data-youtube-facade] img { aspect-ratio: 16/9; object-fit: cover; }
*[data-youtube-facade]:after { content: '\25B6'; font-size: 2.5rem; color: var(--btn-c); text-align: center; display: block; position: absolute; top: calc(50% - 2rem); left: calc(50% - 3rem); width: 5rem; height: 2rem; padding: 1rem 0 1rem 0.5rem; line-height: 2.5rem; border-radius: 1.5rem; background-color: var(--btn); box-shadow: var(--shd); border: 0.1875rem solid var(--btn-c); opacity: 0.8; transition: opacity 0.2s; }
*[data-youtube-facade]:hover:after { box-shadow: var(--shd-h); opacity: 1; }
*[data-youtube-facade]:focus:after { opacity: 1; outline: 0.1875rem solid var(--fcs); outline-offset: 0.1875rem; }
@media (prefers-reduced-motion: no-preference) { ul.cards > li.faded { opacity: 0.25; } }
/* Banners */
.ndeam { max-width: auto; width: 100%; background-color: #fef9f4; background-image: url(https://caniplaythat.com/wp-content/themes/caniplaytheme/img/banners/banner-NDEAM-23-left.png), url(https://caniplaythat.com/wp-content/themes/caniplaytheme/img/banners/banner-NDEAM-23-right.png); background-position: left, right; background-repeat: no-repeat; background-size: contain; }
.ndeam svg.large_logo { fill: var(--g14); color: var(--pp); }