---
---

// solarized theme 
$base03:    #002b36;
$base02:    #073642;
$base01:    #586e75;
$base00:    #657b83;
$base0:     #839496;
$base1:     #93a1a1;
$base2:     #eee8d5;
$base3:     #fdf6e3;
$yellow:    #b58900;
$orange:    #cb4b16;
$red:       #dc322f;
$magenta:   #d33682;
$violet:    #6c71c4;
$blue:      #268bd2;
$cyan:      #2aa198;
$green:     #859900;

:root {
	--background:     #{$base3};
	--background-alt: #{$base2};
	--comment:        #{$base1};
	--text:           #{$base00};
	--text-emph:      #{$base01};
	@import "light_theme"
}

@media (prefers-color-scheme: dark) {
	:root {
		--background:     #{$base03};
		--background-alt: #{$base02};
		--comment:        #{$base01};
		--text:           #{$base0};
		--text-emph:      #{$base1};
	}
	@import "dark_theme"
}

$background:     var(--background);
$background-alt: var(--background-alt);
$comment:        var(--comment);
$text:           var(--text);
$text-emph:      var(--text-emph);

body {
	background-color: $background;
}

img {
	max-width: 100%;
}

figcaption {
	text-align: center;
	color: $text;
}

@import url(https://cdn.jsdelivr.net/npm/firacode@6.2.0/distr/fira_code.css);

code, .Agda { font-family: 'Fira Code', monospace; }

@supports (font-variation-settings: normal) {
  code, .Agda { font-family: 'Fira Code VF', monospace; }
}

code, .Agda {
	background-color: $background-alt;
	padding: 4px;
	font-size: 0.8em;
}

pre code {
	display: block;
}

p, li, th, td {
	color: $text;
}

table, th, td {
	border: 1px solid $text;
}

th, td {
	padding: 5px;
}

.bigger {
	font-size: 1.2em;
}

.bit_bigger {
	font-size: 1.1em;
}

a {
	text-decoration: none;
}

a:link {
	color: $blue;
}

a:visited {
	color: $violet;
}

a:hover {
	color: $cyan;
}

.sitetitle a, bold, em, h1, h2, h3, h4, h5, h6 {
	color: $text-emph;
}

nav ul {
	list-style: none;
	padding: 0;
	margin: 0;
	text-align: center;
}

nav ul li {
	display: inline;
	margin-right: 1em;
	white-space: nowrap;
}

nav ul li a {
	color: $comment;
}

hr {
	color: $comment;
	border: 0;
	border-bottom: 1px dashed; 
}

.centercol {
	width: 700px;
	max-width: 96vw;
	display: block;
	margin: auto;
}