@font-face { font-family: 'Piazzolla'; src: url("../fonts/Piazzolla-Light.woff2") format("woff2"); font-style: normal; font-weight: 300; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla'; src: url("../fonts/Piazzolla-LightItalic.woff2") format("woff2"); font-style: italic; font-weight: 300; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla'; src: url("../fonts/Piazzolla-Regular.woff2") format("woff2"); font-style: normal; font-weight: 400; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla'; src: url("../fonts/Piazzolla-Italic.woff2") format("woff2"); font-style: italic; font-weight: 400; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla'; src: url("../fonts/Piazzolla-Medium.woff2") format("woff2"); font-style: normal; font-weight: 500; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla'; src: url("../fonts/Piazzolla-MediumItalic.woff2") format("woff2"); font-style: italic; font-weight: 500; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla'; src: url("../fonts/Piazzolla-Bold.woff2") format("woff2"); font-style: normal; font-weight: 700; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla'; src: url("../fonts/Piazzolla-BoldItalic.woff2") format("woff2"); font-style: italic; font-weight: 700; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla SC'; src: url("../fonts/PiazzollaSC-Light.woff2") format("woff2"); font-style: normal; font-weight: 300; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla SC'; src: url("../fonts/PiazzollaSC-LightItalic.woff2") format("woff2"); font-style: italic; font-weight: 300; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla SC'; src: url("../fonts/PiazzollaSC-Regular.woff2") format("woff2"); font-style: normal; font-weight: 400; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla SC'; src: url("../fonts/PiazzollaSC-Italic.woff2") format("woff2"); font-style: italic; font-weight: 400; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla SC'; src: url("../fonts/PiazzollaSC-Medium.woff2") format("woff2"); font-style: normal; font-weight: 500; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla SC'; src: url("../fonts/PiazzollaSC-MediumItalic.woff2") format("woff2"); font-style: italic; font-weight: 500; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla SC'; src: url("../fonts/PiazzollaSC-Bold.woff2") format("woff2"); font-style: normal; font-weight: 700; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Piazzolla SC'; src: url("../fonts/PiazzollaSC-BoldItalic.woff2") format("woff2"); font-style: italic; font-weight: 700; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Hack'; src: url("../fonts/hack-regular-subset.woff2") format("woff2"); font-style: normal; font-weight: 400; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Hack'; src: url("../fonts/hack-italic-subset.woff2") format("woff2"); font-style: italic; font-weight: 400; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Hack'; src: url("../fonts/hack-bold-subset.woff2") format("woff2"); font-style: normal; font-weight: 700; text-rendering: optimizeLegibility; }
@font-face { font-family: 'Hack'; src: url("../fonts/hack-bolditalic-subset.woff2") format("woff2"); font-style: italic; font-weight: 700; text-rendering: optimizeLegibility; }
:root { --type-serif: "Piazzolla", serif; --type-caps: "Piazzolla SC", serif; --type-mono: "Hack", monospace; --type-size: 18px; --type-weight: 400; --type-height: 1.4; --type-numeric: oldstyle-nums proportional-nums; --color-particles-text: var(--oc-gray-1); --color-particles-background: var(--oc-gray-9); }

html, html[data-theme="light"] { --color-background: var(--oc-gray-1); --color-text: var(--oc-gray-8); --color-heading: var(--oc-gray-8); --color-link: var(--oc-blue-8); --color-chunk: var(--oc-gray-8); --color-mark: var(--oc-yellow-3); --color-border: var(--oc-gray-4); --color-button: var(--oc-gray-6); }

html[data-theme="dark"] { --color-background: var(--oc-gray-9); --color-text: var(--oc-gray-3); --color-heading: var(--oc-gray-3); --color-link: var(--oc-blue-3); --color-chunk: var(--oc-gray-8); --color-mark: var(--oc-gray-8); --color-border: var(--oc-gray-7); --color-button: var(--oc-gray-7); }

body { font-family: var(--type-serif); font-size: var(--type-size); font-weight: var(--type-weight); line-height: var(--type-height); font-variant-numeric: var(--type-numeric); background-color: var(--color-background); color: var(--color-text); }

svg circle, svg path { stroke: var(--color-text); stroke-width: 0.075em; }

a { text-decoration: none; color: var(--color-link); }
a:focus, a:hover { border-bottom: calc(var(--type-size) / 10) dotted var(--color-link); color: var(--color-link); }

header { display: flex; justify-content: space-between; margin-top: 1.5em; margin-bottom: 2em; }

footer { margin: 2em 0; }

small { font-weight: 300; }

abbr { text-transform: lowercase; font-family: var(--type-caps); }

blockquote { padding-left: 1em; border-left: 0.1em solid var(--color-border); font-weight: 300; }

mark { padding: 0.1em; border-radius: 0.25em; background-color: var(--color-mark); color: var(--color-text); }

hr { border-top: 0.1em solid var(--color-text); }

img { display: block; max-width: 100%; margin: 1em 0; border-radius: 0.25em; }

table.table { color: var(--color-text); }

pre, code { font-family: var(--type-mono); }

.highlight { padding: 0 1em; border-radius: 0.25em; color: var(--color-chunk); }
.highlight pre { padding: 0; margin: 0; }
.highlight .highlight { padding: 0; }

h1, h2, h3 { color: var(--color-heading); }
h1 a, h2 a, h3 a { color: inherit; }
h1 a:focus, h1 a:hover, h2 a:focus, h2 a:hover, h3 a:focus, h3 a:hover { border-color: inherit; color: inherit; }

h1 { font-size: 1.5em; }
h1.page-title { margin: 0; }

#home h1 { margin-top: 1.5em; }

h2 { margin-top: 1.25em; font-size: 1.25em; }

h3 { margin-top: 1em; font-size: 1em; text-transform: lowercase; font-family: var(--type-caps); font-weight: 500; }

h2 + h3 { margin-top: 0; }

a.site-title { font-weight: 500; color: var(--color-heading); }
a.site-title:focus, a.site-title:hover { border-color: inherit; color: inherit; }

.toggle-bar { display: flex; justify-content: end; padding-top: 1.5em; }

.toggle-icon { color: var(--color-heading); }
.toggle-icon:focus, .toggle-icon:hover { cursor: pointer; border: none; }
.toggle-icon:focus svg circle, .toggle-icon:focus svg path, .toggle-icon:hover svg circle, .toggle-icon:hover svg path { stroke-width: 0.1em; }

.message { padding: 0.25em 1em; border-radius: 0.25em; background-color: var(--color-mark); color: var(--color-text); }

dd { padding-left: 0.5em; }

.archive ul, .contact ul { list-style-type: none; padding: 0; }

.li-icon { margin-right: 0.25em; }

a.iconlink svg circle, a.iconlink svg path { stroke: var(--color-link); }
a.iconlink:focus, a.iconlink:hover { border: none; }
a.iconlink:focus svg circle, a.iconlink:focus svg path, a.iconlink:hover svg circle, a.iconlink:hover svg path { stroke-width: 0.1em; }

.footnotes { margin-top: 2em; }
.footnotes p { margin: 0; }
.footnotes::before { content: "Notes"; }

a[href^="#fn:"] { margin-left: 0.1em; font-weight: 500; }
a[href^="#fn:"]:focus, a[href^="#fn:"]:hover { font-weight: 700; border: none; }

a.reversefootnote { font-weight: 500; }
a.reversefootnote:focus, a.reversefootnote:hover { font-weight: 700; border: none; }

#particles-js { width: 100%; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; background-color: var(--color-particles-background); }
#particles-js .particles-js-canvas-el { width: 100%; height: 99.5vh !important; }
#particles-js .jumbotron { position: absolute; top: 44%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); pointer-events: none; }

.fullscreen { min-height: 100vh; }
.fullscreen h1, .fullscreen h2 { color: var(--color-particles-text); }

.particles-photo { width: 50%; border-radius: 50%; margin: auto; margin-bottom: 0.5em; }

.particles-title { margin: 0; font-size: 2.5em; font-weight: 500; white-space: nowrap; }

.particles-subtitle { margin: 0 0 1em 0; font-size: 1.25em; font-weight: 400; }

.nowrap { white-space: nowrap; }

.particles-icon { margin: 0 0.5em; pointer-events: all; }
.particles-icon svg { -webkit-transform: scale(1.8); transform: scale(1.8); }
.particles-icon svg circle, .particles-icon svg path { stroke: var(--color-particles-text) !important; stroke-width: 0.05em; }
.particles-icon:focus, .particles-icon:hover { border: none; }
.particles-icon:focus svg circle, .particles-icon:focus svg path, .particles-icon:hover svg circle, .particles-icon:hover svg path { stroke-width: 0.075em; }

.particles-scroll { position: absolute; bottom: 5%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.particles-scroll .particles-icon { position: relative; -webkit-animation: pulse 1s infinite; animation: pulse 1s infinite; }
.particles-scroll svg { -webkit-transform: scale(2.7); transform: scale(2.7); }

@keyframes pulse { from { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40); opacity: .4; top: 0; }
  50% { -ms-filter: none; filter: none; opacity: 1; top: -1rem; }
  to { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40); opacity: .4; top: 0; } }
.pagination { display: flex; margin-top: 2em; text-align: center; }

.pagination-item { float: left; width: 50%; padding: 1em 2em; border: 0.075em solid var(--color-border); color: var(--color-button); -webkit-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; }
.pagination-item svg circle, .pagination-item svg path { stroke: var(--color-button); }
.pagination-item:first-child { margin-bottom: 0; border-top-left-radius: var(--border-radius); border-bottom-left-radius: var(--border-radius); }
.pagination-item:last-child { margin-left: -1px; border-top-right-radius: var(--border-radius); border-bottom-right-radius: var(--border-radius); }

a.pagination-item { color: var(--color-text); }
a.pagination-item svg circle, a.pagination-item svg path { stroke: var(--color-text); }
a.pagination-item:focus, a.pagination-item:hover { background-color: var(--color-border); border: 0.075em solid var(--color-border); }

@media (prefers-color-scheme: dark) { html, html[data-theme="dark"] { --color-background: var(--oc-gray-9); --color-text: var(--oc-gray-3); --color-heading: var(--oc-gray-3); --color-code: var(--oc-gray-3); --color-link: var(--oc-blue-3); --color-mark: var(--oc-gray-8); --color-border: var(--oc-gray-7); --color-button: var(--oc-gray-7); }
  html[data-theme="light"] { --color-background: var(--oc-gray-1); --color-text: var(--oc-gray-8); --color-heading: var(--oc-gray-8); --color-code: var(--oc-gray-8); --color-link: var(--oc-blue-8); --color-mark: var(--oc-yellow-3); --color-border: var(--oc-gray-4); --color-button: var(--oc-gray-6); } }
@media screen and (min-width: 768px) { body { font-size: 1.25em; }
  .particles-title { font-size: 3.5em; }
  .particles-subtitle { font-size: 1.75em; }
  .particles-icon { margin: 0 1em; }
  .particles-icon svg { -webkit-transform: scale(2.4); transform: scale(2.4); }
  .particles-scroll svg { -webkit-transform: scale(3.6); transform: scale(3.6); } }
@media only print { body { font-size: 10pt; background-color: white; color: black; }
  a { color: black; }
  dd { padding-left: 1.5em; }
  .pagination { display: none; }
  #cv header { margin: 0; }
  #cv .site-title { font-size: 1.5em; }
  #cv small { display: none; }
  #cv .toggle-icon, #cv .li-icon, #cv .reversefootnote, #cv a.iconlink { display: none; } }
