:root { --main-background-color: #262626; --second-background-color: #333333; /*--code-background-color: #f7f7f7;*/ /*--code-background-color-accent: #fcfcfc;*/ --code-background-color: #1f1f1f; --code-background-color-accent: #1c1c1c; --code-border-color: #404040; --code-short-background-color: #404040; --main-text-color: #e6e6e6; --light-text-color: #d9d9d9; --lighter-text-color: #bfbfbf; --dark-text-color: #ffffff; --code-text-color: #1a1a1a; --light-border-color: #cccccc; --link-col: #ff00aa; --underline-color: #999999; --box-background-color: #f2f2f2; --highlight-color: #999999; --footer-circle-color: var(--main-text-color); --footer-icon-color: var(--main-background-color); --generator-string-color: #61a8ff; --btn-primary-color: #ffffff; /* Colours based on Monokai theme. */ --hl-td-linenos-pre-color: #000000; --hl-td-linenos-pre-background: #f0f0f0; --hl-span-linenos-color: #000000; --hl-span-linenos-background: #f0f0f0; --hl-td-linenos-pre-special-color: #000000; --hl-td-linenos-pre-special-background: #ffffc0; --hl-span-linenos-special-color: #000000; --hl-span-linenos-special-background: #ffffc0; --hl-hll: #49483e; --hl-background: #272822; --hl-color: #f8f8f2; --hl-c: #75715e; --hl-err-color: #960050; --hl-err-background: #1e0010; --hl-k: #66d9ef; --hl-l: #ae81ff; --hl-n: #f8f8f2; --hl-o: #f92672; --hl-p: #f8f8f2; --hl-ch: #75715e; --hl-cm: #75715e; --hl-cp: #75715e; --hl-cpf: #75715e; --hl-c1: #75715e; --hl-cs: #75715e; --hl-gd: #f92672; --hl-gi: #a6e22e; --hl-go: #66d9ef; --hl-gp: #f92672; --hl-gu: #75715e; --hl-kc: #66d9ef; --hl-kd: #66d9ef; --hl-kn: #f92672; --hl-kp: #66d9ef; --hl-kr: #66d9ef; --hl-kt: #66d9ef; --hl-ld: #e6db74; --hl-m: #ae81ff; --hl-s: #e6db74; --hl-na: #a6e22e; --hl-nb: #f8f8f2; --hl-nc: #a6e22e; --hl-no: #66d9ef; --hl-nd: #a6e22e; --hl-ni: #f8f8f2; --hl-ne: #a6e22e; --hl-nf: #a6e22e; --hl-nl: #f8f8f2; --hl-nn: #f8f8f2; --hl-nx: #a6e22e; --hl-py: #f8f8f2; --hl-nt: #f92672; --hl-nv: #f8f8f2; --hl-ow: #f92672; --hl-w: #f8f8f2; --hl-mb: #ae81ff; --hl-mf: #ae81ff; --hl-mh: #ae81ff; --hl-mi: #ae81ff; --hl-mo: #ae81ff; --hl-sa: #e6db74; --hl-sb: #e6db74; --hl-sc: #e6db74; --hl-dl: #e6db74; --hl-sd: #e6db74; --hl-s2: #e6db74; --hl-se: #ae81ff; --hl-sh: #e6db74; --hl-si: #e6db74; --hl-sx: #e6db74; --hl-sr: #e6db74; --hl-s1: #e6db74; --hl-ss: #e6db74; --hl-bp: #f8f8f2; --hl-fm: #a6e22e; --hl-vc: #f8f8f2; --hl-vg: #f8f8f2; --hl-vi: #f8f8f2; --hl-vm: #f8f8f2; --hl-il: #ae81ff; }

[data-theme="light"] { --main-background-color: #ffffff; --second-background-color: #e6e6e6; --code-background-color: #f7f7f7; --code-background-color-accent: #fcfcfc; --code-border-color: #404040; --code-short-background-color: #fae0f2; --main-text-color: #1a1a1a; --light-text-color: #404040; --lighter-text-color: #666666; --dark-text-color: #0d0d0d; --code-text-color: #1a1a1a; --light-border-color: #cccccc; --link-col: #0011ff; --underline-color: #999999; --box-background-color: #f2f2f2; --highlight-color: #999999; --footer-circle-color: #221144; --footer-icon-color: #ffffff; --generator-string-color: #61a8ff; --btn-primary-color: #000000; /* Colours based on Colorful theme. */ --hl-td-linenos-pre-color: #000000; --hl-td-linenos-pre-background: #f0f0f0; --hl-span-linenos-color: #000000; --hl-span-linenos-background: #f0f0f0; --hl-td-linenos-pre-special-color: #000000; --hl-td-linenos-pre-special-background: #ffffc0; --hl-span-linenos-special-color: #000000; --hl-span-linenos-special-background: #ffffc0; --hl-hll: #ffffcc; --hl-background: #ffffff; --hl-color: #000000; --hl-c: #888888; --hl-err-color: #FF0000; --hl-err-background: #FFAAAA; --hl-k: #008800; --hl-l: #000000; --hl-n: #000000; --hl-o: #333333; --hl-p: #000000; --hl-ch: #888888; --hl-cm: #888888; --hl-cp: #557799; --hl-cpf: #888888; --hl-c1: #888888; --hl-cs: #cc0000; --hl-gd: #A00000; --hl-gr: #FF0000; --hl-gh: #000080; --hl-gi: #00A000; --hl-go: #888888; --hl-gp: #c65d09; --hl-gu: #800080; --hl-gt: #0044DD; --hl-kc: #008800; --hl-kd: #000880000; --hl-kn: #008800; --hl-kp: #003388; --hl-kr: #008800; --hl-kt: #333399; --hl-m: #6600EE; --hl-s: #000000; --hl-na: #0000CC; --hl-nb: #007020; --hl-nc: #BB0066; --hl-no: #003366; --hl-nd: #555555; --hl-ni: #880000; --hl-ne: #FF0000; --hl-nf: #0066BB; --hl-nl: #997700; --hl-nn: #0e84b5; --hl-nt: #007700; --hl-nv: #996633; --hl-ow: #000000; --hl-w: #bbbbbb; --hl-mb: #6600EE; --hl-mf: #6600EE; --hl-mh: #005588; --hl-mi: #0000DD; --hl-mo: #4400EE; --hl-sa: #fff0f0; --hl-sb: #fff0f0; --hl-sc: #0044DD; --hl-dl: #fff0f0; --hl-sd: #DD4422; --hl-s2: #fff0f0; --hl-se: #666666; --hl-sh: #fff0f0; --hl-si: #eeeeee; --hl-sx: #DD2200; --hl-sr: #000000; --hl-s1: #fff0f0; --hl-ss: #AA6600; --hl-bp: #007020; --hl-fm: #0066BB; --hl-vc: #336699; --hl-vg: #dd7700; --hl-vi: #3333BB; --hl-vm: #996633; --hl-il: #0000DD; }

/* --- General --- */
body { font-family: Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif; font-display: swap; font-size: 18px; color: var(--main-text-color); position: relative; background-color: var(--main-background-color); }

p { line-height: 1.5; margin: 30px 0; }

h1, h2, h3, h4, h5, h6 { font-weight: 800; }

a { color: var(--link-col); }

a:hover, a:focus { color: var(--link-col); }

blockquote { background-color: var(--box-background-color); color: var(--light-text-color); font-style: italic; }

blockquote p:first-child { margin-top: 0; }

hr.small { max-width: 100px; margin: 15px auto; border-width: 4px; border-color: inherit; border-radius: 3px; }

.main-content { padding-top: 80px; }

@media only screen and (min-width: 768px) { .main-content { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); padding-top: 130px; } }
.main-explain-area { padding: 15px inherit; }

.hideme { display: none; }

::-moz-selection { color: white; text-shadow: none; background-color: var(--link-col); }

::selection { color: white; text-shadow: none; background-color: var(--link-col); }

img::selection { color: white; background: transparent; }

img::-moz-selection { color: white; background: transparent; }

img { max-width: 100%; }

.linked-section { padding-top: 60px; margin-top: -25px; }

/* --- Navbar --- */
.navbar-nav .theme-btn { width: 45px; }
.navbar-nav .far { color: var(--footer-circle-color); cursor: pointer; }
.navbar-nav .far:hover { color: var(--link-col); }

.navbar-custom { background-color: var(--second-background-color); border-bottom: 1px solid #EAEAEA; }

.navbar-custom .nav li a { text-transform: uppercase; font-size: 12px; letter-spacing: 1px; }

.navbar-custom .navbar-brand, .navbar-custom .nav li a { font-weight: 800; color: var(--light-text-color); }

.navbar-custom .navbar-brand:hover, .navbar-custom .navbar-brand:focus, .navbar-custom .nav li a:hover, .navbar-custom .nav li a:focus { color: var(--link-col); }

.navbar-custom .navbar-brand-logo { padding-top: 0; -webkit-transition: padding .5s ease-in-out; -moz-transition: padding .5s ease-in-out; transition: padding .5s ease-in-out; }

.navbar-custom .navbar-brand-logo img { height: 50px; -webkit-transition: height .5s ease-in-out; -moz-transition: height .5s ease-in-out; transition: height .5s ease-in-out; transition: transform .2s; }

.navbar-custom .navbar-brand-logo img:hover { transform: scale(1.1); }

.navbar-custom.top-nav-short .navbar-brand-logo { padding-top: 5px; }

.navbar-custom.top-nav-short .navbar-brand-logo img { height: 40px; }

@media only screen and (min-width: 768px) { .navbar-custom { padding: 20px 0; -webkit-transition: padding .5s ease-in-out; -moz-transition: padding .5s ease-in-out; transition: padding .5s ease-in-out; }
  .navbar-custom.top-nav-short { padding: 0; } }
.navbar-custom .avatar-container { position: absolute; left: 50%; width: 50px; margin-top: -25px; }

.navbar-custom .avatar-container .avatar-img-border { width: 100%; border-radius: 50%; margin-left: -50%; display: inline-block; box-shadow: 0 0 8px rgba(0, 0, 0, 0.8); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.8); }

.navbar-custom .avatar-container .avatar-img { width: 100%; border-radius: 50%; display: block; }

.navbar-custom.top-nav-expanded .avatar-container { display: none; }

@media only screen and (min-width: 768px) { .navbar-custom .avatar-container { width: 100px; margin-top: -50px; }
  .navbar-custom .avatar-container .avatar-img-border { width: 100%; box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); }
  .navbar-custom .avatar-container .avatar-img { width: 100%; } }
.container-fluid { padding-left: max(15px, env(safe-area-inset-left)); padding-right: max(15px, env(safe-area-inset-right)); }

/* Multi-level navigation links */
.navbar-custom .nav .navlinks-container { position: relative; }

.navbar-custom .nav .navlinks-parent:after { content: " \25BC"; }

.navbar-custom .nav .navlinks-children { width: 100%; display: none; word-break: break-word; }

.navbar-custom .nav .navlinks-container .navlinks-children a { display: block; padding: 10px; padding-left: 30px; background-color: var(--second-background-color); text-decoration: none !important; border-width: 0 1px 1px 1px; font-weight: normal; }

@media only screen and (max-width: 767px) { .navbar-custom .nav .navlinks-container.show-children { background: rgba(0, 0, 0, 0.2); }
  .navbar-custom .nav .navlinks-container.show-children .navlinks-children { display: block; } }
@media only screen and (min-width: 768px) { .navbar-custom .nav .navlinks-container { text-align: center; }
  .navbar-custom .nav .navlinks-container:hover { background: rgba(0, 0, 0, 0.1); }
  .navbar-custom .nav .navlinks-container:hover .navlinks-children { display: block; }
  .navbar-custom .nav .navlinks-children { position: absolute; }
  .navbar-custom .nav .navlinks-container .navlinks-children a { padding-left: 10px; border: 1px solid #eaeaea; border-width: 0 1px 1px; } }
.navbar-header { padding-left: 15px; }

.navbar-right { padding-right: 15px; }

/* --- Footer --- */
footer { padding: 30px 0; font-size: 14px; background-color: var(--second-background-color); }

footer p.text-muted { color: var(--lighter-text-color); }

footer a { color: var(--footer-circle-color); }
footer a .fa-circle { color: var(--footer-circle-color); }
footer a .fab { color: var(--footer-icon-color); }
footer a .fab:hover { color: var(--link-col); }

footer .list-inline { margin: 0; padding: 0; }

footer .copyright { text-align: center; margin-bottom: 0; }

footer .theme-by { text-align: center; margin: 10px 0 0; }

@media only screen and (min-width: 768px) { footer { padding: 50px 0; }
  footer .footer-links { font-size: 18px; }
  footer .copyright { font-size: 16px; } }
.footer-support { padding-top: 2em; }

.footer-support a { text-decoration: none; color: var(--main-text-color); }

.footer-support a:focus, .footer-support a:hover { text-decoration: none; color: var(--main-background-color); }

.footer-support div img { width: 6em; height: 6em; }

.footer-support-text { font-weight: 900; font-size: 1em; }

.footer-patreon { padding: 1em 0 2em; display: flex; justify-content: center; align-items: center; }

.footer-kofi { padding: 1em 0 2em; display: flex; justify-content: center; align-items: center; }

/* --- Post preview --- */
.posts-list { margin-top: 1em; }

.post-row { padding-bottom: 1em; }

/*
.post-preview { //padding: 10px 0; //border-bottom: 1px solid var(--main-text-color); //overflow: auto;
}
*/
@media only screen and (min-width: 768px) { .post-preview .post-preview-container { padding-top: 10px; padding-bottom: 10px; } }
@media only screen and (max-width: 768px) { .post-preview .post-preview-container { padding: 2em; } }
.post-preview .post-preview-container { padding-top: 10px; padding-bottom: 10px; }

.post-preview:last-child { border-bottom: 0; }

.post-preview a { text-decoration: none; color: var(--main-text-color); }
.post-preview a div .post-bigimg { transition: transform .2s; }

.post-preview a:focus, .post-preview a:hover { text-decoration: none; color: var(--link-col); }
.post-preview a:focus div .post-bigimg, .post-preview a:hover div .post-bigimg { transform: scale(1.1); }

.post-title { display: block; font-size: 1.3em; margin-top: 0; margin-bottom: 0.2em; font-weight: 900; }

.post-preview .post-subtitle { margin: 0; font-weight: 400; margin-bottom: 10px; }

.post-preview .post-meta, .post-heading .post-meta { font-size: 0.7em; font-weight: bold; display: block; }

.post-entry-container { display: inline-block; width: 100%; }

.post-entry { width: 100%; }

.post-image { float: right; height: 192px; width: 192px; margin-top: -35px; filter: grayscale(90%); }

.post-image:hover { filter: grayscale(0%); }

.post-image img { border-radius: 100px; height: 192px; width: 192px; }

.post-preview .post-read-more { font-weight: 800; }

@media only screen and (min-width: 768px) { .post-title { font-size: 20px; } }
/* --- Tags --- */
.blog-tags { color: var(--light-text-color); font-size: 15px; margin-bottom: 30px; }

.blog-tags a { color: var(--link-col); text-decoration: none; padding: 0px 5px; }

.blog-tags a:hover { border-radius: 2px; color: var(--link-col); background-color: #EEE; }

.post-preview .blog-tags { margin-top: 5px; margin-bottom: 0; }

@media only screen and (min-width: 768px) { .post-preview .blog-tags { margin-top: 10px; } }
@media only screen and (max-width: 500px) { .post-image, .post-image img { height: 100px; width: 100px; }
  .post-image { width: 100%; text-align: center; margin-top: 0; float: left; } }
/* --- Post and page headers --- */
.intro-header { margin: 80px 0 20px; position: relative; }

.intro-header.big-img { background: no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover; margin-top: 51px; /* The small navbar is 50px tall + 1px border */ margin-bottom: 35px; }

.big-img-darken { backdrop-filter: brightness(50%) saturate(135%); }

/*
.intro-header.big-img .container .row div
{ backdrop-filter: brightness(50%) saturate(135%);
}
*/
.intro-header.big-img .big-img-transition { position: absolute; width: 100%; height: 100%; opacity: 0; background: no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover; }

.intro-header .page-heading { text-align: center; }

.intro-header.big-img .page-heading, .intro-header.big-img .post-heading { padding: 100px 0; color: #FFF; text-shadow: 1px 1px 3px #000; }

.intro-header .page-heading h1 { margin-top: 0; font-size: 50px; }

.intro-header .post-heading h1 { margin-top: 0; font-size: 35px; }

.intro-header .page-heading .page-subheading, .intro-header .post-heading .post-subheading { font-size: 1.5em; line-height: 1.1; display: block; font-weight: 300; margin: 10px 0 0; font-style: italic; }

.intro-header .post-heading .post-subheading { margin-bottom: 20px; }

.intro-header.big-img .page-heading .page-subheading, .intro-header.big-img .post-heading .post-subheading { font-weight: 400; }

.intro-header.big-img .page-heading hr { box-shadow: 1px 1px 3px #000; -webkit-box-shadow: 1px 1px 3px #000; -moz-box-shadow: 1px 1px 3px #000; }

.intro-header.big-img .post-heading .post-meta { color: #EEE; }

.intro-header.big-img .img-desc { background: rgba(30, 30, 30, 0.6); position: absolute; padding: 5px 10px; font-size: 11px; color: #EEE; right: 0; bottom: 0; display: none; }

@media only screen and (min-width: 768px) { .intro-header { margin-top: 130px; }
  .intro-header.big-img { margin-top: 91px; /* Full navbar is small navbar + 20px padding on each side when expanded */ }
  .intro-header.big-img .page-heading, .intro-header.big-img .post-heading { padding: 150px 0; }
  .intro-header .page-heading h1 { font-size: 80px; }
  .intro-header .post-heading h1 { font-size: 50px; }
  .intro-header.big-img .img-desc { font-size: 14px; } }
.header-section.has-img .no-img { margin-top: 0; background-color: #FCFCFC; margin: 0 0 40px; padding: 20px 0; box-shadow: 0 0 5px #AAA; }

/* Many phones are 320 or 360px, so make sure images are a proper aspect ratio in those cases */
.header-section.has-img .intro-header.no-img { display: none; }

@media only screen and (max-width: 365px) { .header-section.has-img .intro-header.no-img { display: block; }
  .intro-header.big-img { width: 100%; height: 220px; }
  .intro-header.big-img .page-heading, .intro-header.big-img .post-heading { display: none; }
  .header-section.has-img .big-img { margin-bottom: 0; } }
@media only screen and (max-width: 325px) { .intro-header.big-img { height: 200px; } }
.caption { text-align: center; font-size: 14px; padding: 10px; font-style: italic; margin: 0; display: block; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }

#header-gh-btns { margin-bottom: 15px; }

@media only screen and (max-width: 500px) { #header-gh-btns > iframe { display: block; margin-bottom: 5px; } }
/* --- Pager --- */
.pager li a { text-transform: uppercase; font-size: 14px; font-weight: 800; letter-spacing: 1px; padding: 10px 5px; background-color: #FFF; border-radius: 0; color: #404040; }

@media only screen and (min-width: 768px) { .pager li a { padding: 15px 25px; } }
.pager li a:hover, .pager li a:focus { color: #FFF; border: 1px solid var(--link-col); background-color: var(--link-col); }

.pager { margin: 10px 0 0; }

.pager.blog-pager { margin-top: 5px; margin-bottom: 10px; }

@media only screen and (min-width: 768px) { .pager.blog-pager { margin-top: 5px; margin-bottom: 10px; } }
/* --- Tables --- */
table { padding: 0; }

table tr { border-top: 1px solid var(--light-text-color); background-color: var(--main-background-color); margin: 0; padding: 0; }

table tr:nth-child(2n) { background-color: var(--second-background-color); }

table tr th { font-weight: bold; border: 1px solid var(--light-text-color); text-align: left; margin: 0; padding: 6px 13px; }

table tr td { border: 1px solid var(--light-text-color); text-align: left; margin: 0; padding: 6px 13px; }

table tr th :first-child, table tr td :first-child { margin-top: 0; }

table tr th :last-child, table tr td :last-child { margin-bottom: 0; }

/* --- Code blocks --- */
code { color: #e43460; font-weight: bold; }

pre { font-size: 16px; line-height: 1.5em; }

pre code { white-space: pre; font-weight: normal; }

pre.highlight, .highlight > pre, td.code pre { background-color: var(--main-background-color); background-image: linear-gradient(var(--code-background-color) 50%, var(--code-background-color-accent) 50%); background-repeat: repeat; background-size: 2.5em 2.5em; background-position: 0px 10px; border-left: 7px solid var(--link-col); }

code table, code table td, code table th, code table tbody, code table tr, td.gutter pre { padding: 0; border: none; background-color: var(--main-background-color); }

.highlight > pre { padding: 0; }

.highlight > pre.highlight { padding: 9.5px; }

td.code pre { border-width: 0 0 0 2px; border-style: solid; border-color: var(--code-border-color); border-radius: 0; }

td.gutter { padding-top: 3px; }

/* --- Social media sharing section --- */
#social-share-section { margin-bottom: 30px; }

/* --- Notification boxes --- */
.box-note, .box-warning, .box-error, .box-success { padding: 15px 15px 15px 10px; margin: 20px 20px 20px 5px; border: 1px solid var(--main-text-color); border-left-width: 5px; border-radius: 5px 3px 3px 5px; }

.box-note { background-color: var(--main-background-color); border-left-color: #2980b9; }

.box-warning { background-color: var(--main-background-color); border-left-color: #f1c40f; }

.box-error { background-color: var(--main-background-color); border-left-color: #c0392b; }

.box-success { background-color: var(--main-background-color); border-left-color: #3CB371; }

/* Fix table border github gist snippets */
.gist, .gist-file table tr { border: unset; }

.gist, .gist-file table tr td { border: unset; }

/* Fix .navbar-toggle */
.navbar-default button.navbar-toggle:focus, .navbar-default button.navbar-toggle:hover { background-color: initial; }

.navbar-default button.navbar-toggle[aria-expanded="true"] { background-color: rgba(0, 0, 0, 0.2); }

/* Tags page */
.tag-btn { margin: 5px; }

#full-tags-list .tag-entry { margin: 0 0 15px 25px; }

#full-tags-list .tag-entry a { font-size: 20px; }

#full-tags-list .tag-entry .entry-date { color: #808080; font-style: italic; font-size: 16px; }

#gh-button-link { text-decoration: none; }

.gh-button { font-weight: bold; background-color: #007fff; border-radius: 0.5em; color: #fff; padding: 8px; }

.gh-icon { padding-left: 10px; padding-right: 10px; }

.center-image { margin: 0 auto; display: block; }

.post-bigimg { margin-bottom: 1em; border-radius: 1em; }

.series-part-list { margin-top: -1em; display: block; width: 100%; font-size: 18px; font-weight: 800; }

.series-part-list a { text-decoration: none; }

.series-part { display: inline-block; background-color: var(--main-background-color); color: var(--main-text-color); height: 2em; line-height: 2em; width: 2em; border: solid var(--main-text-color); border-radius: 100%; border-width: 2px 2px; margin-bottom: 0.5em; }

.series-part-this { background-color: var(--main-text-color); color: var(--main-background-color); }

.series-part:hover { color: white; text-shadow: none; background-color: var(--link-col); }

.profile-pic { margin-top: -2em; width: 8em; height: 8em; border-radius: 100%; }

.nopadding { padding: 0 !important; margin: 0 !important; }

@media only screen and (min-width: 768px) { .post-info { padding-left: 20px !important; } }
.video-embed { width: 100%; height: 0; padding-bottom: 56.25%; position: relative; }
.video-embed iframe { width: 100%; height: 100%; position: absolute; }

.asset-btn { padding-top: 5px;   /* .btn { background-color: var(--btn-primary-color); color: #ffffff; }
 .btn:hover { color: var(--link-col); } */ }

.asset-btn .btn { font-size: 130%; }

.highlighter-rouge { background-color: var(--code-short-background-color); }

/*
.shopify-buy__product__title
{ color: var(--main-text-color);
}

.shopify-buy__product__price
{ color: var(--main-text-color);
}

.shopify-box
{ width: 100%; padding: 10px; margin-left: auto; margin-right: auto; margin-bottom: 20px; border-radius: 5px; border: 1px solid black; background-color: white;
}
*/
.asset-pack-intro { margin-bottom: 20px; }

.fa-chevron-left, .fa-chevron-right { position: relative; top: 50%; bottom: 50%; }

#asset-pack-carousel { margin-bottom: 1em; }

.doc-nav { border-right: 1px solid var(--main-text-color); }

.generated-string-intro { font-weight: 800; }

.generated-string { font-weight: 800; }

.btn-primary { background-color: #2896FF; }

.icon { max-height: 1.5em; }

#unity-canvas { border: 1px solid var(--main-text-color); }

.generator { font-size: 150%; font-weight: 600; padding-left: 0.5em; padding-right: 0.5em; }

pre { line-height: 125%; margin: 0; }

td.linenos pre { color: var(--hl-td-linenos-pre-color); background-color: var(--hl-td-linenos-pre-background); padding-left: 5px; padding-right: 5px; }

span.linenos { color: var(--hl-span-linenos-color); background-color: var(--hl-span-linenos-background); padding-left: 5px; padding-right: 5px; }

td.linenos pre.special { color: var(--hl-td-linenos-pre-special-color); background-color: var(--hl-td-linenos-pre-special-background); padding-left: 5px; padding-right: 5px; }

span.linenos.special { color: var(--hl-span-linenos-special-color); background-color: var(--hl-span-linenos-special-background); padding-left: 5px; padding-right: 5px; }

.highlight .hll { background-color: var(--hl-hll); }

.highlight { background: var(--hl-background); color: var(--hl-color); }

.highlight .c { color: var(--hl-c); }

/* Comment */
.highlight .err { color: var(--hl-err-color); background-color: var(--hl-err-background); }

/* Error */
.highlight .k { color: var(--hl-k); }

/* Keyword */
.highlight .l { color: var(--hl-l); }

/* Literal */
.highlight .n { color: var(--hl-n); }

/* Name */
.highlight .o { color: var(--hl-o); }

/* Operator */
.highlight .p { color: var(--hl-p); }

/* Punctuation */
.highlight .ch { color: var(--hl-ch); }

/* Comment.Hashbang */
.highlight .cm { color: var(--hl-cm); }

/* Comment.Multiline */
.highlight .cp { color: var(--hl-cp); }

/* Comment.Preproc */
.highlight .cpf { color: var(--hl-cpf); }

/* Comment.PreprocFile */
.highlight .c1 { color: var(--hl-c1); }

/* Comment.Single */
.highlight .cs { color: var(--hl-cs); }

/* Comment.Special */
.highlight .gd { color: var(--hl-gd); }

/* Generic.Deleted */
.highlight .ge { font-style: italic; }

/* Generic.Emph */
.highlight .gi { color: var(--hl-gi); }

/* Generic.Inserted */
.highlight .go { color: var(--hl-go); }

/* Generic.Output */
.highlight .gp { color: var(--hl-gp); font-weight: bold; }

/* Generic.Prompt */
.highlight .gs { font-weight: bold; }

/* Generic.Strong */
.highlight .gu { color: var(--hl-gu); }

/* Generic.Subheading */
.highlight .kc { color: var(--hl-kc); }

/* Keyword.Constant */
.highlight .kd { color: var(--hl-kd); }

/* Keyword.Declaration */
.highlight .kn { color: var(--hl-kn); }

/* Keyword.Namespace */
.highlight .kp { color: var(--hl-kp); }

/* Keyword.Pseudo */
.highlight .kr { color: var(--hl-kr); }

/* Keyword.Reserved */
.highlight .kt { color: var(--hl-kt); }

/* Keyword.Type */
.highlight .ld { color: var(--hl-ld); }

/* Literal.Date */
.highlight .m { color: var(--hl-m); }

/* Literal.Number */
.highlight .s { color: var(--hl-s); }

/* Literal.String */
.highlight .na { color: var(--hl-na); }

/* Name.Attribute */
.highlight .nb { color: var(--hl-nb); }

/* Name.Builtin */
.highlight .nc { color: var(--hl-nc); }

/* Name.Class */
.highlight .no { color: var(--hl-no); }

/* Name.Constant */
.highlight .nd { color: var(--hl-nd); }

/* Name.Decorator */
.highlight .ni { color: var(--hl-ni); }

/* Name.Entity */
.highlight .ne { color: var(--hl-ne); }

/* Name.Exception */
.highlight .nf { color: var(--hl-nf); }

/* Name.Function */
.highlight .nl { color: var(--hl-nl); }

/* Name.Label */
.highlight .nn { color: var(--hl-nn); }

/* Name.Namespace */
.highlight .nx { color: var(--hl-nx); }

/* Name.Other */
.highlight .py { color: var(--hl-py); }

/* Name.Property */
.highlight .nt { color: var(--hl-nt); }

/* Name.Tag */
.highlight .nv { color: var(--hl-nv); }

/* Name.Variable */
.highlight .ow { color: var(--hl-ow); }

/* Operator.Word */
.highlight .w { color: var(--hl-w); }

/* Text.Whitespace */
.highlight .mb { color: var(--hl-mb); }

/* Literal.Number.Bin */
.highlight .mf { color: var(--hl-mf); }

/* Literal.Number.Float */
.highlight .mh { color: var(--hl-mh); }

/* Literal.Number.Hex */
.highlight .mi { color: var(--hl-mi); }

/* Literal.Number.Integer */
.highlight .mo { color: var(--hl-mo); }

/* Literal.Number.Oct */
.highlight .sa { color: var(--hl-sa); }

/* Literal.String.Affix */
.highlight .sb { color: var(--hl-sb); }

/* Literal.String.Backtick */
.highlight .sc { color: var(--hl-sc); }

/* Literal.String.Char */
.highlight .dl { color: var(--hl-dl); }

/* Literal.String.Delimiter */
.highlight .sd { color: var(--hl-sd); }

/* Literal.String.Doc */
.highlight .s2 { color: var(--hl-s2); }

/* Literal.String.Double */
.highlight .se { color: var(--hl-se); }

/* Literal.String.Escape */
.highlight .sh { color: var(--hl-sh); }

/* Literal.String.Heredoc */
.highlight .si { color: var(--hl-si); }

/* Literal.String.Interpol */
.highlight .sx { color: var(--hl-sx); }

/* Literal.String.Other */
.highlight .sr { color: var(--hl-sr); }

/* Literal.String.Regex */
.highlight .s1 { color: var(--hl-s1); }

/* Literal.String.Single */
.highlight .ss { color: var(--hl-ss); }

/* Literal.String.Symbol */
.highlight .bp { color: var(--hl-bp); }

/* Name.Builtin.Pseudo */
.highlight .fm { color: var(--hl-fm); }

/* Name.Function.Magic */
.highlight .vc { color: var(--hl-vc); }

/* Name.Variable.Class */
.highlight .vg { color: var(--hl-vg); }

/* Name.Variable.Global */
.highlight .vi { color: var(--hl-vi); }

/* Name.Variable.Instance */
.highlight .vm { color: var(--hl-vm); }

/* Name.Variable.Magic */
.highlight .il { color: var(--hl-il); }

/* Literal.Number.Integer.Long */
