/*                            ...
           s,                .                    .s
            ss,              . ..               .ss
            'SsSs,           ..  .           .sSsS'
             sSs'sSs,        .   .        .sSs'sSs
              sSs  'sSs,      ...      .sSs'  sSs
               sS,    'sSs,         .sSs'    .Ss
               'Ss       'sSs,   .sSs'       sS'
      ...       sSs         ' .sSs'         sSs       ...
     .           sSs       .sSs' ..,       sSs       .
     . ..         sS,   .sSs'  .  'sSs,   .Ss        . ..
     ..  .        'Ss .Ss'     .     'sSs. ''        ..  .
     .   .         sSs '       .        'sSs,        .   .
      ...      .sS.'sSs        .        .. 'sSs,      ...
            .sSs'    sS,     .....     .Ss    'sSs,
         .sSs'       'Ss       .       sS'       'sSs,
      .sSs'           sSs      .      sSs           'sSs,
   .sSs'____________________________ sSs ______________'sSs,
.sSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS'.Ss SSSSSSSSSSSSSSSSSSSSSs,
                        ...         sS'
                         sSs       sSs
                          sSs     sSs
                           sS,   .Ss
                           'Ss   sS'
                            sSs sSs
                             sSsSs
                              sSs
                               s

                     YOU ARE YOUR OWN GOD.
             YOU HAVE THE POWER TO CHANGE THE WORLD.
                     MAKE THE MOST OF IT.
*/

:root{
	/* --text: #Crimson; */
	--text: #DC143C;
	/* --bg: #Black; */
	--bg: #000000;
	--highlight: #80dec5;
	--max: 90ch;
	--fonts: "Garamond", times, serif;
}


/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
  list-style: none;
}

/* Set core root defaults */
html:focus-within {
  scroll-behavior: smooth;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}


::selection{background: var(--text);color: var(--bg);}
::-moz-selection{background: var(--text);color: var(--bg);}
mark{background-color: var(--highlight)}


/* main wrapper for sidebar elements */
.with-sidebar {
	display: flex;
	flex-wrap: wrap;
	gap: 3em;
	padding: 0 15px;
	padding-top: 4ex;
}

/* the actual sidebar */
.with-sidebar > :first-child {
	flex-grow: 1;
}

/* the main content */
.with-sidebar > :last-child {
	flex-basis: 20rem;
	flex-grow: 999;
	min-width: 50%;
}


body{
	font-size: calc(1rem + 0.5vw);
	font-family: var(--fonts);
	font-style: normal;
	max-width: var(--max);
	padding:1em 7%;
	margin: 0px auto;
	line-height: 1.6;
	color:var(--text);
	background-color:var(--bg);
}
h1{letter-spacing: -0.02em;line-height: 1.2;}
h2,h3{letter-spacing: -0.02em;line-height: 1;} 
h1{font-size: clamp(2.0rem, 5vw, 3.0rem);}
h2{font-size: clamp(1.25rem, 5vw, 2.25rem);padding-bottom: 2ex;}
h3{font-size: clamp(1rem, 3vw, 1.5rem);padding-top: 2em;}


/* fancy scrollbar */
body::-webkit-scrollbar{width: 0.75rem;}
body::-webkit-scrollbar-track{background-color: var(--bg);border: 1px solid var(--text);}
body::-webkit-scrollbar-thumb{background-color: var(--text);}


article{margin:0px auto;background-color:var(--bg);}


/* p{padding-bottom: 2ex;} */
pre{
	font-size: calc(1rem + 0.25vw);
	overflow-x: auto;
	padding: 2%; 
	text-align: left; 
	border-style: solid; 
	color: var(--bg); 
	background-color: var(--text); 
	line-height: 1.15em;
	margin-top: 0; 
}
table td, table th{vertical-align:top;padding:2.5px 5px;text-align:left}
blockquote {
	position:relative;
	border-color:var(--text);
	border-style:solid;
	border-width: thin;
	margin-bottom: 2ex;
}
blockquote > p{padding: 2em;}


legend{padding:0;}
fieldset{
	border: 1px solid #000;
	padding-left: 2em;
	padding-right: 2em;
	padding-bottom: 1em;
	margin-bottom: 2em;
}
div .break {margin-bottom: 2em;}


/* details {border: 1px solid var(--text);border-radius: 4px;padding: .5em .5em 0;} */
/* details[open] {padding: .5em;} */
/* details[open] summary {border-bottom: 1px solid var(--text);margin-bottom: .5em;} */
/* summary {font-weight: bold;margin: -.5em -.5em 0;padding: .5em;} */
details > *:not(summary) {margin-left: 1em;} 


/* link inverts when hovered */
*:not(footer) > a{color: var(--bg);background-color: var(--text);text-decoration: none;}
*:not(footer) > a:hover{color: var(--text);background-color: var(--highlight);}


img{width: 100%; margin-top: 1em;margin-bottom: 1em;} 
img.webring{transform:scale(1.4);} 


audio{border-radius:0px;}


hr{border: 1px solid var(--text);margin: 2em;}


footer { border-top:1.5px solid;padding:30px 0 0 0;margin-top:30px;clear:both } 
footer > * { display:inline-block;}
footer img { margin:0 0 -10px 0;width:30px } 


svg{fill: var(--text);}
svg:hover{color: var(--bg);}


nav h2 {height:50px}