@font-face {
  font-family: 'Alegreya';
  src: url('../fonts/Alegreya-Regular.ttf')
}

html {
  background-color: rgb(253, 246, 227);
}

body {
  color: rgb(101, 123, 131);
  font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", "Ubuntu", "Oxygen", "Roboto", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  color: rgb(88, 110, 117);
  font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

strong {
  color: rgb(7, 54, 66);
}

.navbar {
  border-bottom: 1px solid rgba(0, 0, 0, 0.37);
}

.particles {
  overflow: hidden;
  border-bottom: 1px solid transparent;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

section a, .breadcrumb a {
  color: rgb(203, 75, 22);
  border-bottom: 1px solid transparent;
}

section a:hover, .breadcrumb a:hover {
  color: rgb(203, 75, 22);
  border-bottom: 1px solid rgb(156, 168, 155);
  background-color: transparent;
}

/* Breadcrumbs */
.breadcrumb li + li::before {
  color: #e91e63;
  content: "»";
}

/* Navbar */
.navbar-item + .navbar-item:before {
  content: '»';
  width: 2.5em;
}

/* General styles */
p {
  margin: 0.5em 0;
}

.section h1 {
  font-size: 2rem;
  margin: 2rem 0 0;
}

.section h2 {
  font-size: 1.5rem;
  margin: 1em 0 0;
}

.section h3 {
  font-size: 1.25rem;
  margin: 1em 0 0;
}

.section h4 {
  font-size: 1.15rem;
  margin: 1em 0 0;
}

.section h5 {
  font-size: 0.92rem;
  font-style: italic;
  margin: 1em 0 0;
}

.section h6 {
  font-size: 0.85rem;
  font-weight: bold;
  text-transform: uppercase;
  margin: 1em 0 0;
}


/* Square for lists */
nav#TableOfContents ul {
  list-style: square;
  margin-left: 1em;
}

.blog ul,
.about ul,
.den ul,
.default-single ul,
.default-list ul
{
  list-style: square;
  margin-left: 1em;
}

.blog ul > li,
.about ul > li,
.den ul > li,
.default-single ul > li,
.default-list ul > li
{
  font-size: 0.95em;
}

.blog ul > li:last-child,
.about ul > li:last-child,
.den ul > li:last-child,
.default-single ul > li:last-child,
.default-list ul > li:last-child
{
  margin-bottom: 1em;
}

nav#TableOfContents > ul > li > ul {
  font-size: 0.9em;
}

/* Only show top-most level for TOC on CV */
.cv nav#TableOfContents > ul > li > ul {
  display: none;
}

/* Custom mods for Bulma */
.card {
  box-shadow: 3px 5px 11px rgba(50, 50, 50, 0.3);
  border: 1px solid rgba(50, 115, 220, 0);
  transition: all 1s ease;
}

.card:hover {
  border: 1px solid rgba(88, 110, 117, 0.8);
  /*box-shadow: 3px 5px 11px rgba(50, 94, 220, 0.3);*/
}

.card-header {
  box-shadow: initial;
  border-bottom: 1px solid rgba(0, 0, 0, 0.17);
}

.card.main-page {
  margin-top: 2rem;
}

/* blog: Cards */

.blog .card {
  margin: 2em 0;
}

/* Utils */
.is-marginless-bottom {
  margin-bottom: 0 !important;
}

pre {
  max-width: 640px;
  border: 1px solid #e91e63;
}

.highlight pre {
  max-width: 640px;
  border: 1px solid #e91e63;
}

.highlight {
  margin: 1.5em 0;
}

/* Date formatting */
.dates {
  font-size: 0.9em;
}

.dates small {
  font-size: 0.9em;
}

a.read-more {
  font-size: 0.9em;
  text-transform: uppercase;
}

a.read-more:after {
  content: "..."
}

.made-with {
  max-width: 128px;
}

a {
  font-size: 1.1em;
}

.story-title {
  line-height: 1.4em;
}

.story-title a {
  font-size: 1.31em;
}

.story-version {
  font-size: 0.65em;
  color: rgb(77, 67, 67);
  background-color: rgb(238, 232, 213);
}

.story-tag {
  font-size: 0.65em;
  color: rgb(77, 67, 67);
  background-color: rgb(238, 232, 213);
}

blockquote {
  font-style: italic;
  border-left: 2px solid gray;
  margin-left: 1em;
  padding-left: 0.5em;
}