/* spyros.loonydesk.com */

:root {--global-font-size: 15px;--global-line-height: 1.4em;--global-space: 10px;--font-stack: "Lato", "Courier New", sans-serif;--mono-font-stack: "Lato", "Courier New", sans-serif;--background-color: #fff;--page-width: 1088px;--font-color: #151515;--paragraph-color: #494949;--img-opacity:1.0;--img-background:#ffffff;--invert-font-color: #fff;--primary-color: #0d6ba5;--secondary-color: #727578; --error-color: #d20962;--progress-bar-background: #727578;--progress-bar-fill: #151515;--code-bg-color: #e8e8e8;--input-style: solid;--display-h1-decoration: none;--section-background-color: #f6f6f6;--block-background-color: var(--background-color);}

.night {--background-color: #101010;--font-color: #777;--paragraph-color:#777;;--img-opacity:0.95;--img-background:#303030;--primary-color: #7293C1; --secondary-color: #5B874C;--error-color: #d20962;--code-bg-color: #303030;--section-background-color: #1e1e1e;--block-background-color: var(--background-color);}

* {box-sizing: border-box;text-rendering: geometricprecision;}
*::selection {background: var(--primary-color);color: var(--invert-font-color);}

html {scroll-behavior:smooth;scroll-padding-top:90px;}
body {font-size: var(--global-font-size);color: var(--font-color);line-height: var(--global-line-height);margin: 0;font-family: var(--font-stack);word-wrap: break-word;background-color: var(--background-color);}
body {padding:0;margin:0;border-top:5px solid var(--font-color);}

h1,h2,h3,h4,h5,h6,.logo {line-height: var(--global-line-height);}
a {cursor: pointer;color: var(--primary-color);text-decoration: none;}
a:hover {background-color: var(--code-bg-color);color: var(--primary-color);}
em {font-size: var(--global-font-size);font-style: italic;font-family: var(--font-stack);color: var(--font-color);}
blockquote,code,em,strong {line-height: var(--global-line-height);}

blockquote,code,footer,h1,h2,h3,h4,h5,h6,header,li,ol,p,section,ul,.logo {float: none;margin: 0;padding: 0;}
blockquote,h1,ol,p,ul,.logo {margin-top: calc(var(--global-space) * 2);margin-bottom: calc(var(--global-space) * 2);}
h1,.logo {position: relative;padding: calc(var(--global-space) * 2) 0 calc(var(--global-space) * 2);margin: 0;overflow: hidden;font-weight: 600;}

h1::after {position: absolute;bottom: 5px;left: 0;display: var(--display-h1-decoration);}
h1 + *,.logo + * {margin-top: 0;}
h2,h3,h4,h5,h6 {position: relative;margin-bottom: var(--global-line-height);font-weight: 600;}

blockquote {background: url(../images/site/blockquote.png) no-repeat 0 12px;padding: 10px 20px 10px 50px;margin-left:30px;color:var(--secondary-color);}
blockquote, q {quotes: none;}
blockquote > *:last-child {margin-bottom: 0;}

code {font-weight: inherit;background-color: var(--code-bg-color);font-family: var(--mono-font-stack);}
code::after,code::before {content: "`";display: inline;}
pre code::after,pre code::before {content: "";}
pre {display: block;word-break: break-all;word-wrap: break-word;color: var(--secondary-color);background-color: var(--block-background-color);border: 1px solid var(--secondary-color);padding: var(--global-space);white-space: pre-wrap;white-space: -moz-pre-wrap;white-space: -o-pre-wrap;}
pre code {overflow-x: scroll;padding: 0;margin: 0;display: inline-block;min-width: 100%;font-family: var(--mono-font-stack);background-color: var(--block-background-color);}

.terminal-prompt {position: relative;white-space: nowrap;}
.terminal-prompt::before {content: "> ";}
.terminal-prompt::after {content: "";animation: cursor 800ms infinite;background: var(--secondary-color);border-radius: 0;display: inline-block;height: 1em;margin-left: 0.2em;width: 3px;bottom: -2px;position: relative;}
@keyframes cursor {0% {opacity: 0;}50% {opacity: 1;} 100% {opacity: 0;}}
@keyframes cursor {0% {opacity: 0;}50% {opacity: 1;}100% {opacity: 0;}}

li,li > ul > li {position: relative;display: block;padding-left: calc(var(--global-space) * 2);}
nav > ul > li {padding-left: 0;}
li::after {position: absolute;top: 0;left: 0;}
ul > li::after {content: "-";}
nav ul > li::after {content: "";}
ol li::before {content: counters(item, ".") ". ";counter-increment: item;}
ol ol li::before {content: counters(item, ".") " ";counter-increment: item;}
ol {counter-reset: item;}
ol li:nth-child(n+10)::after {left: -7px;}
ol ol {margin-top: 0;margin-bottom: 0;}
ul ul {margin-top: 0;margin-bottom: 0;}
img {max-width: 100%;}
p {margin: 0 0 var(--global-line-height);color:var(--paragraph-color);}
time{padding-top:25px;padding-bottom:15px;float:right;font-family:'Montserrat', arial, sans-serif;font-size:14px;color:var(--secondary-color);}
section.active { display: block; transition: display 0.4s allow-discrete, opacity 0.4s ease;}
section {display: none; margin-bottom:25px;padding:0px 15px 15px 0px;background: var(--section-background-color);border-radius: 1%;padding: 20px;}
hr {position: relative;overflow: hidden;margin: calc(var(--global-space) * 4) 0;border: 0;border-bottom: 1px dashed var(--secondary-color);}

.container {max-width: var(--page-width);}
.container,.container-fluid {margin: 0 auto;padding: 0 calc(var(--global-space) * 2);}
.container {margin-bottom:25px;}
.side-menu{background: var(--section-background-color);border-radius: 1%;padding:20px 20px 10px 20px;}
.title {font: normal 40px/1em 'Over the Rainbow', arial, sans-serif;color:var(--font-color);text-align:left;padding:0px 0px 24px 0px;margin:20px 0px 10px 0px;float:left;display:inline;}
.sub-header{color:var(--primary-color);font-weight:300;}
.sfonts{font-family:'Montserrat', arial, sans-serif;font-size:14px;color:var(--font-color);}
.site-description {font: italic 19px/1em 'Patrick Hand', arial, sans-serif; color:var(--secondary-color);}
.post-date {float:right;padding-right:10px;color:var(--secondary-color);}
.img-opacity {opacity:var(--img-opacity);}
.img-bg {background-color:var(--img-background);padding:5px;}
.books li {display: inline-block;vertical-align: top;width: 160px;text-align:center;padding-bottom:20px;font-size:14px;line-height:16px;position:static;}
.books img {display: block;margin: 3px auto;}
.library img { padding: 5px; background:#F8F8F8; background:var(--img-background); }
.whitepapers li {padding-bottom:10px;padding-left:10px;}
ul.whitepapers{margin-bottom:0;}
.justify {text-align:justify;}
.center {text-align:center;}
.mb-10 {margin-bottom:10px !important;}
.no-mb {margin-bottom:0px !important;}
.terminal-prompt::before {content:"";}
.prompt {color:var(--font-color);font: 19px/1em 'Patrick Hand', arial, sans-serif;display:inline;}
.prompt a {color:inherit;}
.header-container {margin-bottom:25px;border-bottom:1px dashed #888;background: var(--background-color);}
.components-grid {display: grid;grid-column-gap: 1.4em;grid-template-columns: auto;grid-template-rows: auto;}
.image-grid {display: grid;grid-template-rows: auto;grid-gap: 1em;grid-template-columns: repeat(auto-fit, minmax(calc(var(--page-width) / 12), 1fr));}
.toggle {float: right;font-family: 'Montserrat', arial, sans-serif;background: transparent;border: 0;color: var(--primary-color);font-size:15px;}
.toggle:before {content:'⟳ ';}
button.toggle:hover {background:var(--code-bg-color);}
.footer {padding-top:10px;text-align:left;font-family:'Montserrat',arial,serif;border-top:1px dashed var(--code-bg-color);}
.float-right {float:right;}
.dark {color:var(--primary-color);}

@media only screen and (min-width: 768px) {
    .components-grid {grid-template-columns: 9fr 3fr;}
}
@media only screen and (max-width: 480px) {
    time, .site-description {display: none;}
    .post-date{display:block;width:100%;}
}
@media only screen and (max-width: 565px) {
    .books li {width: 100%;text-align: left;padding-bottom: 8px;font-size: 16px;line-height: 20px;}
    .books li a {display: inline-flex;}
    .books img {width:64px;height:64px;object-fit: contain;   display: block;background:none;}
    .books span {display:flex;align-items:center;height:64px;}
}