@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

.book.font-family-0 {
	font-family: "Libre Baskerville", Georgia, serif;
}

.book.font-family-1 {
	font-family: "Ubuntu", "Helvetica Neue", Helvetica, Arial,
		sans-serif;
}

.glsl-small {
	width: 30%;
	aspect-ratio: 1/1;
	display: block !important;
	margin: auto !important;
}

.glsl-medium {
	width: 50%;
	aspect-ratio: 1/1;
	display: block !important;
	margin: auto !important;
}

.glsl-large {
	width: 100%;
	aspect-ratio: 1/1;
	display: block !important;
	margin: auto !important;
}

.float-img {
	float: left;
	margin-right: 3em;
}

.video {
	position: relative;
	padding-bottom: 56.25%;
	margin-bottom: 1rem;
	width: 100%;
}

.video iframe {
	position: absolute;
	height: 100%;
	width: 100%;
}

ol.bibliography li {
	list-style: none;
	padding-left: 20px;
}

ol.bibliography li::first-letter {
	margin-left: -40px;
}

.emoji {
	width: auto;
	height: 1.5em;
}

.mermaid {
  text-align: center;
}

/* Tooltip from https://www.w3schools.com/css/css_tooltip.asp */
.jekyll-glossary {
  position: relative;
  display: inline-block;
  border-bottom: 2px dotted #0074bd;
  cursor: help;
}

.jekyll-glossary .jekyll-glossary-tooltip {
  visibility: hidden;
  background-color: black;
  color: #fff;
  text-align: center;
  font-size: 0.7em;
  padding: 5px;
  border-radius: 6px;

  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;

  width: 250px;
  bottom: 100%;
  left: 50%;
  margin-left: -125px; /* Use half of the width to center the tooltip */

}

/* Show the tooltip text when you mouse over the tooltip container */
.jekyll-glossary:hover .jekyll-glossary-tooltip {
  visibility: visible;
}

/* Style the source link (if there is one provided in the glossary entry). */
.jekyll-glossary-source-link:before {
  content: "[source]";  // "(reference)", "<link>" or whatever you want.
}

/* Arrow created with borders. */
.jekyll-glossary .jekyll-glossary-tooltip::after {
  content: " ";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

/* Animation from invisible to visible on hover. */
.jekyll-glossary .jekyll-glossary-tooltip {
  opacity: 0;
  transition: opacity 1s;
}
.jekyll-glossary:hover .jekyll-glossary-tooltip {
  opacity: 1;
}

/* HACK: hide surrounding parenthesis on definition. When Jekyll renders
 * post.excerpt, all HTML and CSS is stripped. The effect is that the extra
 * parenthesis that are added are hidden in the normal blog post with hoover, but
 * hidden in the post.except when html and css is stripped. Ref:
 * https://github.com/erikw/jekyll-glossary_tooltip/issues/7#issuecomment-2711471867 */
 .jekyll-glossary-tooltip-hidden {
    display: none;
  }

/* Change code BG color */
.markdown-section pre {
  border-radius: 10px;
  font-family: "JetBrains Mono";
	background: #fdf0ed;
}
.markdown-section code {
  font-family: "JetBrains Mono";
	background-color: #fdf0ed;
}

.markdown-section {
  overflow: visible;
}