limi.css

/* HSL
$color1: hsla(37%, 82%, 61%, 1);
$color2: hsla(352%, 60%, 55%, 1);
$color3: hsla(188%, 100%, 27%, 1);
$color4: hsla(207%, 49%, 37%, 1);
$color5: hsla(200%, 100%, 18%, 1);
*/

/* RGB
$color1: rgba(237, 174, 73, 1);
$color2: rgba(209, 73, 91, 1);
$color3: rgba(0, 121, 140, 1);
$color4: rgba(48, 99, 142, 1);
$color5: rgba(0, 61, 91, 1);
*/

@-ms-viewport {
	width: device-width;
}

/* @group non-macOS/iOS Fonts */
@font-face {
  font-family: 'Libre Baskerville';
  font-style: italic;
  font-weight: 400;
  src: local('Libre Baskerville Italic'), local('LibreBaskerville-Italic'), url(https://fonts.gstatic.com/s/librebaskerville/v5/kmKhZrc3Hgbbcjq75U4uslyuy4kn0qNcWxEQDO-Wyrs.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 400;
  src: local('Libre Baskerville'), local('LibreBaskerville-Regular'), url(https://fonts.gstatic.com/s/librebaskerville/v5/kmKnZrc3Hgbbcjq75U4uslyuy4kn0qNZaxMaC82U.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 700;
  src: local('Libre Baskerville Bold'), local('LibreBaskerville-Bold'), url(https://fonts.gstatic.com/s/librebaskerville/v5/kmKiZrc3Hgbbcjq75U4uslyuy4kn0qviTgY3KcC-wLOj.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* @end */

@font-face {
  font-family: 'Iowan Old Style';
  src: local('Iowan Old Style');
}

/* replace ampersands with pretty italic Baskerville */
@font-face {
  font-family: 'Iowan Old Style';
  src: local('Baskerville-Italic'), local('Iowan Old Style'), url(https://fonts.gstatic.com/s/librebaskerville/v5/kmKhZrc3Hgbbcjq75U4uslyuy4kn0qNcWxEQDO-Wyrs.woff2) format('woff2');
  unicode-range: U+0026;
}

/* Firefox needs this explicitly declared for some reason. All browsers are trash. */
@font-face {
  font-family: 'Iowan Old Style';
  font-style: italic;
  font-weight: normal;
  src: local('IowanOldStyle-Italic');
}
/* @group Basics */

body {
	margin: 0;
	border: 0;
	font-family: "Iowan Old Style", "Libre Baskerville", serif;
	color: black;
	-webkit-font-smoothing: antialiased; /* Sorry */
	-moz-osx-font-smoothing: grayscale; /* Sorry */
}

a {
	text-decoration: none;
}

/* @end */

/* @group Containers */

.container {
	max-width: 820px;
	margin: 0 auto;
}

.index {
	margin: 0 5em;
}

.index > div {
	display: table-cell;
}

.index .avatar {
	float: left;
	border-radius: 62px;
	height: 48px;
	width: 48px;
	margin-top: 0;
	margin-right: 30px;
}

.pagination {
	text-align: center;
}

/* @end */

/* @group Navigation */

.blog-cover {
	z-index: 1;
}

/*.article-cover, .blog-cover,*/
nav {
	background-size: cover;
	background-position: top center;
	max-width: 100%;
	margin-top: 0;
	position: relative;
	height: 300px;
	background-color: #fff;
	width: 100%;
	top: 0;
	text-align: center;
}

nav a {
	color: rgba(255,255,255,0.9);
	font-size: 5em;
	position: relative;
	top: 30%;
	transform: translateY(-50%);
}

nav a:hover {
	color: rgba(255,255,255,0.7) !important;
}

nav a.secondary {
	font-size: 1.3em;
	text-transform: lowercase;
	font-variant: small-caps;
	display: inline-block;
	padding: 0 2em 0.5em 2em;
	font-family: "Avenir Next", Arial, sans-serif;
	font-weight: 600;

}


/* @end */

/* @group Footer */

.site-footer {
	padding: 2em 0;
	background-color: black;
	color: #ddd;
	text-align: center;
}

.site-footer a {
	color: #ddd;
	border: 0;
}

.site-footer p {
	color: #999;
}

.site-footer p a {
	margin: 0;
	color: #999;
}

.site-footer nav {
	display: inline-block;
}

/* @end */

/* @group Data tables */

article table {
	border-spacing: 0;
}

article table strong {
	font-weight: bold;
	font-style: normal;
}

article table td,
article table th {
	padding: 1em;
	vertical-align: top;
	text-align: center;
}

article table td.listingCheckbox,
article table th.listingCheckbox {
	text-align: center;
}

article table th {
	text-align: left;
	border-bottom: 1px solid #e7e7e7;
	white-space: nowrap;
}
article table tbody th {
	font-weight: bold;
}
article table tbody tr {
	text-align:left;
}
article table tbody tr:nth-child(even) {
	background: #f9f9f9;
}

/* @end */

/* @group Listings */
ul.listing {
	display: grid;
	grid-template-columns: calc(50% - 1px) calc(50% - 1px);
	grid-column-gap: 2px;
	grid-row-gap: 2px;
	list-style: none;
	font-size: 2em;
	margin: 2px 0;
	padding: 0;
	text-align: center;
}

ul.listing li {
	margin: 0;
}

ul.listing li a {
	display: flex;
  align-items: center;
  justify-content: center;
	background-color: #333;
	padding: 15%;
	height: 100px;
}

/* Smaller displays only get one column */
@media (max-width: 720px) {
	ul.listing {
		grid-template-columns: auto;
	}
	ul.listing li {
		margin: 0;
	}
	ul.listing li a {
		height: 75px;
	}
}

/*
1: rgba(237, 174, 73, 1);
2: rgba(209, 73, 91, 1);
3: rgba(0, 121, 140, 1);
4: rgba(48, 99, 142, 1);
5: rgba(0, 61, 91, 1);
*/

ul.listing li:nth-child(1n) a {
	background-color: rgba(237, 174, 73, 1);
}
ul.listing li:nth-child(2n) a {
	background-color: rgba(209, 73, 91, 1);
}
ul.listing li:nth-child(3n) a {
	background-color: rgba(0, 121, 140, 1);
}
ul.listing li:nth-child(4n) a {
	background-color: rgba(48, 99, 142, 1);
}
ul.listing li:nth-child(5n) a {
	background-color: rgba(0, 61, 91, 1);
}

ul.listing li a {
	color: rgba(255,255,255,0.9);
}

/* @end */

/* @group Article */

article {
	background: #fff;
	padding: 1em 0;
	font-size: 18px;
}

article a:link,
article a:visited {
	color: rgb(195,31,35);
	text-decoration: none;
	/* border-bottom: 1px solid #ddd; */
}

article a:active {
	color: #888;
	text-decoration: none;
}

article a:hover {
	color: #888;
	text-decoration: none;
}

article .container > header, article .container > section, article .container > footer {
	margin: 0 8em;
}

article .meta {
	color: #888;
	font-size: 13px;
	text-transform: uppercase;
	margin-bottom: 0.3em;
	font-weight: 400;
	letter-spacing: 1px;
}

article img {
	max-width: 100%;
	margin: 1em 0;
}

article img + em {
	display: block;
	clear: both;
	font-size: 90%
}

article .subtitle {
	font-size: 1.4em;
	margin: 0.2em 0;
	color: #888;
	font-weight: 300;
}

article footer {
	margin-bottom: 2em !important;
}

/* limi.net start */

h1,h2,h3,h4,h5,h6 {
	text-align: center;
	font-weight: normal;
	line-height: 1.1em;
}

h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {
	border-bottom: none !important;
}

h1, h2 {
	letter-spacing: -1px;
}

nav h1 a {
	font-size: 1.5em;
	color: rgba(255,255,255,0.9);
}

h1 {
	font-size: 4em;
	margin: 0;
}
h2 {
	font-size: 3em;
	margin: 0;
}
h3 {
	font-size: 1.5em;
}
h4 {
	font-size: 1.25em;
}
h5 {
	font-size: 1em;
}
h6 {
	font-size: 0.75em;
}

h2, h3 {
    margin-top: 0.5em;
}

.documentFirstHeading {
    width:11em;
    margin: auto;
}


/* First words are transformed to small-caps if they are marked with a span immediately inside a p */
p > span:first-child {
    text-transform: lowercase;
    font-variant: small-caps;
}

header + section > p:first-child,
header + section > hr + p {
	text-indent: -0.2em; /* change this to adjust both drop-cap and first-line simultaneously */
}

/* can't use text-indent because of Safari on iOS horizontal overflow bug :( */
section > :not(hr) + p::first-letter {
	display: inline-block;
}

header + section > p:first-child::first-letter,
header + section > hr + p::first-letter,
header + section > p:first-child > .dropcaps,
header + section > hr + p > .dropcaps {
  font-size: 3.0em;
  line-height: 1;
  margin-top: -0.01em;
	margin-bottom: -0.02em;
/* One of the rare Firefox CSS bugs! Firefox is still applying the parent
   paragraph’s line-height to the first letter, ignoring its much-larger
   font size, while the other browsers are correctly applying a line-height
   that corresponds with the letter’s font-size. */

  float: left;
  display: block;
  margin-right: 0.07em;
  margin-left: 0; /* change this to adjust drop-cap */
	padding-left: 0;
  color: rgb(195,31,35);
	font-variant: normal;
  text-transform: uppercase;
}


h2 + p,
h3 + p,
p.description + p,
hr + p {
	text-indent: 0;
}

p {
	font-size: 1.1em;
	line-height: 1.5em;
	text-indent: 0;
	margin: 0.75em 0;
	/* text-align: justify; */
  /* -moz-hyphens: auto; */
}

ul, ol {
  padding-left: 1em;
  clear: both;
}

ul, ol, dl {
  font-size: 1.1em;
  line-height: 1.5em;
	margin: 0.5em 0;
	text-align: left;
}

ul ul,
ul ol,
ol ul {
	font-size: 1em !important;
}

li {
	margin: 0.25em 0;
}

dt {
  font-variant: small-caps;
  margin-bottom: 0.25em;
  margin-top: 1em;
	text-transform: lowercase;
}

dd {
	margin: 0 0 0.25em 1em;
  display: list-item;
	font-size: 0.9em;
}


b, strong, label {
	font-family: "IowanOldStyle-Bold", "Iowan Old Style", Baskerville, "Libre Baskerville", Georgia, serif;
}

em, address {
	font-family: "IowanOldStyle-Italic", "Iowan Old Style", Baskerville, "Libre Baskerville", Georgia, serif;
}

i {
  font-variant: small-caps;
	font-style: normal;
	text-transform: lowercase;
}

blockquote {
  padding: 1em;
  margin: 1em 0;
  font-size: 90%;
}

/* Blockquote paper curl */

blockquote {
	position: relative;
  background-color: white;
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.2);
}
blockquote:before, blockquote:after
{
	position: absolute;
	width: 50%;
	height: 1em;
	content: ' ';
	left: 0.3em;
	bottom: 1em;
	background: transparent;
	transform: skew(-5deg) rotate(-5deg);
	box-shadow: 0 0.6em 1em rgba(0, 0, 0, 0.3);
  z-index: -1;
}

blockquote:after
{
	left: auto;
	right: 0.3em;
	transform: skew(5deg) rotate(5deg);
}

/* End paper curl */

blockquote p {
    text-indent: 0;
}

q {
    quotes: "“" "”" "‘" "’"
}

textarea {
	width: 100%;
}

pre {
	background-color: #222;
	color: #fff;
	font-family: Monaco, Consolas, Inconsolata, "Courier New", monospace;
	padding: 1em 3em;
	overflow-x: auto;
	font-size: 0.8em;
	margin-bottom: 1em;
	line-height: 1.3em;
}

code {
	font-family: "American Typewriter", Consolas, Inconsolata, "Courier New", monospace;
        font-size: 90%;
}

hr {
    margin: 1em auto;
    clear: both;
	font-size: 1.4em;
	text-align: center;
	border: none;
}

/* We’re bringing asterism back */
hr::after {
  content: "\2042";
}

sup {
    font-size: 60%;
}

abbr,
acronym {
    font-variant: small-caps;
    text-transform: lowercase;
    font-style: normal;
    border: none;
    cursor: help;
	text-decoration: none;
}

abbr[title='and'] {
	font-family: Baskerville, "Iowan Old Style", "Libre Baskerville", Georgia, serif;
	border: none;
	font-style: italic;
}

del { color: #b00; }
del span { color: #333; padding: 0 0.1em; }

kbd {
    background: #ddd;
    border-radius: 4px 4px 4px 4px;
    border-top: 1px solid #eee;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    margin: 0 0.1em;
    min-width: 1em;
    padding: 0 0.5em 0.1em;
    white-space: nowrap;
    font-family: "American Typewriter", Consolas, Inconsolata, "Courier New", monospace;
}

legend {display: none;}
fieldset {border: none;}
/* @end */



/* @group Site-specific */

p.description {
    text-align: center;
	padding: 1em 0;
	font-variant: small-caps;
    margin: auto;
    max-width: 20em;
    text-transform: lowercase;
    text-indent: 0;
	letter-spacing: 0.1em;

}

p.byline {
    color: #888;
    font-variant: small-caps;
    display: block;
    text-align: center;
    letter-spacing:0.3em;
    text-transform: lowercase;
    clear:both;
	margin: 1em 0;
	text-indent: 0;
}

.discreet {
    color: #888;
    font-size: 95%;
}

/* @end */

/* @group iPhone */

@media (max-width: 720px) {

	nav a {
		font-size: 4em;
	}
	nav a.secondary {
		font-size: 1.2em;
		padding: 0 1em 0.5em 1em;
	}
	p, ul, ol {
		text-align: left;
		font-size: 120%;
	}

	h1 {
		font-size: 2.75em;
	}

	p.byline {
		font-size: 110%;
	}

	ul.listing {
		font-size: 1.75em;
	}

	article .container > header, article .container > section, article .container > footer {
		padding: 0;
		margin: 1.5em 5%;
	}

	article .container > footer {
		padding: 2em 0;
	}

	article .full, article pre {
		margin: 1em 0;
	}

	article pre {
		padding: 1em;
	}

	article blockquote {
		margin: 1em 0;
	}

	article blockquote p {
		font-size: 1em;
	}

	.blog-cover {
		height: 200px;
	}

	.blog-cover img {
		height: 200px;
		width: auto;
	}

	.blog-cover section {
		padding: 60px 0 0;
		text-align: center;
	}

	.blog-cover section a {
		margin: 0.5em;
	}

	.blog-cover h1 {
		font-size: 1.5em;
	}

	.blog-cover h3 {
		font-size: 1em;
	}

	.site-nav .tagline span {
		display: none;
	}

	.site-nav #navigation a {
		display: none;
	}

	.site-nav #navigation .brand {
		display: inline-block;
	}

	.site-footer {
		margin-top: 0;
		padding: 2em 10%;
		text-align: center;
	}

	.site-footer nav {
		display: block;
		float: none !important;
		padding: 1em;
	}

	.index {
		padding: 0;
		margin: 0 10%;
	}

	.index > div {
		margin: 0;
	}

	.index img {
		display: none;
	}
} 	/* @end iPhone*/

/* Dark Mode overrides */
@media (prefers-color-scheme: dark) {
  body {
    background-color: black;
    color: #eee;
  }
  article {
      background: black;
      color: #eee;
  }
  blockquote {
      background-color: transparent;
  }
header + section > p:first-child::first-letter,
header + section > hr + p::first-letter,
header + section > p:first-child > .dropcaps,
header + section > hr + p > .dropcaps {
  color: rgba(252,48,83);
}
/* OLED iPhones get pure black */
@media(max-device-width : 568px) 
  and (-webkit-device-pixel-ratio : 3)
  and (prefers-color-scheme: dark) {
    body {
      background-color: black;
    }
    article {
      background: black;
  }
}
/* Print layout */
@media print {
    * {
        text-shadow: none !important;
        color: #000 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    a, a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
        content: "";
    }

    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr, img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }
    @page {
        margin: 2cm .5cm;
    }
    p, h2, h3 {
        orphans: 3;
        widows: 3;
    }

    h2, h3 {
        page-break-after: avoid;
    }

    .navbar {
        display: none;
    }

    .table td, .table th {
        background-color: #fff !important;
    }

    .btn > .caret, .dropup > .btn > .caret {
        border-top-color: #000 !important;
    }

    .label {
        border: 1px solid #000;
    }

    .table {
        border-collapse: collapse !important;
    }

    .table-bordered th, .table-bordered td {
        border: 1px solid #ddd !important;
    }
}
/* End print layout */