/*
 * Defaults to go with `background-image` directive
 */
.remark-slide-content {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/*
 * Dark mode style, taken from the Remark example slideshow
 * and tweaked
 */
.inverse {
  background-color: #272822;
  color: #f3f3f3;
  text-shadow: 0 0 20px #333;
}
.inverse a {
  color: cyan;
}
.inverse h1,
.inverse h2,
.inverse h3,
.inverse h4 {
  line-height: 0.8em;
}

/*
 * Slide: personal-intros
 */

#slide-personal-intros .avatar {
  position: absolute;
  width: 36%;
}
#slide-personal-intros .avatar h2,
#slide-personal-intros .avatar p {
  margin: 0;
  text-align: center;
}
#slide-personal-intros .avatar img {
  width: 100%;
  margin: 0;
  border-radius: 50%;
  filter: drop-shadow(10px 10px 4px rgba(0,0,0,0.5));
}
#slide-personal-intros .avatar-1 {
  top: 10%;
  left: 0;
  z-index: 3;
}
#slide-personal-intros .avatar-2 {
  top: 20%;
  left: 31%;
  z-index: 2;
}
#slide-personal-intros .avatar-3 {
  top: 30%;
  left: 64%;
  z-index: 1;
}

/*
 * Slide: core-software
 */

#slide-core-software h2 {
  display: inline-block;
  position: absolute;
  left: 0;
  padding: .25em .5em;
  border-radius: 0 10px 10px 0;
  color: white;
  background: black;
}

/*
 * Slide: highlight-query
 */

#slide-highlight-query::before {
  content: " ";
  display: block;
  position: absolute;
  right: -5px;
  top: 369px;
  width: 163px;
  height: 42px;
  border: 5px solid red;
  border-radius: 5px;
}

/*
 * Slide: highlight-routing
 */

#slide-highlight-routing::before {
  content: " ";
  display: block;
  position: absolute;
  left: 297px;
  top: 56px;
  width: 42px;
  height: 38px;
  border: 5px solid red;
  border-radius: 5px;
}

/*
 * Slide: highlight-search
 */

#slide-highlight-search::before {
  content: " ";
  display: block;
  position: absolute;
  left: 1px;
  top: 56px;
  width: 338px;
  height: 38px;
  border: 5px solid red;
  border-radius: 5px;
}

/*
 * Slide: highlight-editor
 */

#slide-highlight-editor::before {
  content: " ";
  display: block;
  position: absolute;
  left: 191px;
  top: 3px;
  width: 81px;
  height: 39px;
  border: 5px solid red;
  border-radius: 5px;
}

/*
 * Slide: highlight-controls
 */

#slide-highlight-controls::before {
  content: " ";
  display: block;
  position: absolute;
  right: -5px;
  top: 58px;
  width: 42px;
  height: 304px;
  border: 5px solid red;
  border-radius: 5px;
}


/*
 * Slide type: quote
 *
 * Adapted from https://stackoverflow.com/a/34708570 Posted by Baodad
 * Additional credit: http://callmenick.com/post/styling-blockquotes-with-css-pseudo-classes
 * Retrieved 2026-08-12, License - CC BY-SA 3.0
 */
.quote blockquote {
  font-size: 32px;
  font-family: Georgia, serif;
  position: relative;
  margin: 0.5em;
  padding: 0.5em 2em 0.5em 3em;
}
.quote blockquote cite {
  font-size: 24px;
}
.quote blockquote:before {
  font-family: Georgia, serif;
  position: absolute;
  font-size: 6em;
  line-height: 1;
  top: 0;
  left: 0;
  content: "\201C";
  color: #aaa;
}
.quote blockquote:after {
  font-family: Georgia, serif;
  position: absolute;
  float:right;
  font-size:6em;
  line-height: 1;
  right:0;
  bottom:-0.5em;
  content: "\201D";
  color: #aaa;
}
.quote blockquote footer {
  padding: 0 2em 0 0;
  text-align:right;
}
.quote blockquote cite:before {
  content: "\2013";
}
