@import url("https://www.closedless.xyz/resources/CSS/gruvbox-themes.css");
@import url("https://www.closedless.xyz/~robert/css/fonts.css");
@import url("https://www.closedless.xyz/~robert/css/scrollbar.css");
@import url("https://www.closedless.xyz/~robert/css/navbar.css");

/* ELEMENT STYLING */

/* Body */
body{
	color: var(--gruv-fg);
	font-size: 12pt;
	line-height: 1.5em;
	padding: 1em;
	margin: auto;
	max-width: 70em;
	background: var(--gruv-bg);
}

/* buttons */
button {
	font-family: inherit; /*Fix UserAgent stylsheet "fixing things"*/

}


/* Links */

a.footnote {
    vertical-align: super;
    font-size: 75%;
}

a{
	color: var(--gruv-blue);
	text-decoration: none;
}

a:visited {
	color: var(--gruv-blue-l);
}

a:hover {
	color: var(--gruv-aqua);
	cursor: pointer;
}

a:active {
	color: var(--gruv-aqua);
}

a:focus {
	outline: thin dashed;
}

a:hover,
a:active {
	outline: none;
}


p a:not(.footnote) {
	color: var(--gruv-bg) !important ;
	background-color: var(--gruv-blue-l);
	border-radius: 10px;
	border: dotted transparent;
	white-space: nowrap;
}

p a:hover:not(.footnote) {
	background-color: var(--gruv-aqua);
	border: dotted;
}

p a:active:not(.footnote) {
	background-color: var(--gruv-aqua);
}

a.thumb{
	text-decoration: none;
	display: block;
	width: fit-content;
}




/* Paragraph */
p {
	margin: 1em 0;
}

/* Image */
img {
	border: 0;
	max-width: 50%;
}
img.thumb {
	max-height: 200px;
	border-radius: 10px;
}


/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 600;
	color: var(--gruv-red);
	clear: both; /* New headings always appear below floats */
}

h4,
h5,
h6 {
	font-weight: 700;
	color: var(--gruv-purple);
}

h1 {
	font-size: 2em;
	color: var(--gruv-red-l);
}

h2 {
	font-size: 1.8em;
}

h3 {
	font-size: 1.5em;
}

h4 {
	font-size: 1.4em;
}

h5 {
	font-size: 1.3em;
}

h6 {
	font-size: 1.2em;
}



/* article List */
ul.articles {
	list-style: none;
	padding: 0;
}

ul.articles li {
	padding-bottom: 10px;
}

p.date {
	font-size: 13px;
	color: var(--gruv-fg2);
	margin: 0;
}

span.modified {
	color: var(--gruv-fg4);
	font-style: italic;
}
span.modified::before {
	content: "Modified: ";
}

/* Alternative Download format*/
ul.thumbAlternates {
	list-style: none;
	padding: inherit;
	margin: inherit;
	margin-inline: inherit;
	width: fit-content;
	display: inline-table;
}

ul.thumbAlternates > li {
	width: min-content;
	overflow: hidden;
	display: table-row;
	border-top: 1px black solid;
}

.thumbAlternates img.thumb {
	max-height: 300px;
	border-radius: inherit;
	display: table-cell;
}

.thumbAlternates li:last-child {
	border-radius: 0px 0px 10px 10px;
}
.thumbAlternates li:first-child {
	border-radius: 10px 10px 0px 0px;
}
.thumbAlternates li:nth-child(2) {
	border-top: none;
}
ul.thumbAlternates > li > a {
	background: var(--gruv-blue-l);
	color:  var(--gruv-bg);
	display: table-cell;
	border-radius: inherit;
	border: inherit;
	text-align: center;
}

/* Code Blocks */
code {
    font-family: var(--font-mono);
    font-size: 10pt;
    line-height: 1.25em;
		max-height: 15em;
}

/* Details formatting */

summary {
    background: var(--gruv-bg1);
    border-radius: 10px 10px 0px 0px;
    padding: 10px;
}

details {
    background: var(--gruv-bg1);
    border-radius: 10px;
    padding: 10px;
}

details ul {
    padding-inline-start: 20px;
}

pre {
    margin: 0px 0px;
}

/* Image asides */
img.aside-right {
    margin: 0.5em;
    float: right;
    max-width: 45vw;
}

img.aside-left {
    margin: 0.5em;
    float: left;
    max-width: 45vw;
}

/* Footnotes */
section.footnotes {
	font-size: smaller;
}

/* boxed divs */

div.boxed
{
	border: .25em solid;
    padding: .5em;
    margin: 1em;
}

/* media queries */
@media(width <= 500px)
{
	img.aside-right {
		float: none;
		max-width: 75vw;
	}
	img.aside-left {
		float: none;
		max-width: 75vw;
	}
}