/* adds little arrow to external links */
a[target="_blank"]:after {
    content: url('/assets/img/external-link.svg');
    vertical-align: middle;
    padding-left: 0.3%;
}

#banner {
    margin: 1em 1em 1em 1em;
}
#banner p {
    margin-bottom: 2em;
}

main { margin: 0 auto; max-width: 960px; }

/* make images reponsive */
img { max-width: 100%; height: auto; }

/* make reponsive pre tags */
pre { 
    white-space: pre-wrap; 
    word-break: break-word; 
    background: #f4f4f4;
    border: 1px solid #ddd;
    border-left: 3px solid #a64bb3;
}
code {
    font-family: "JetBrains Mono", Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
    font-variant-ligatures: normal;
    font-size: 1em;
}
code[data-lang]::before { 
    content: attr(data-lang); 
    display: block; 
    color: white;
    padding-left: 0.5%;
    margin-bottom: 1em;
    background-color: #a64bb3;
}

/* links are black and hover to purple */
a { color: black; }
a:hover { color: purple; }

/* main navigation bar */
nav { padding: 1em; }
nav a { margin-left: 1em; padding: 1%; }

hr {
    margin-bottom: 1em;
    border: 0;
    height: 2px;
    background-image: linear-gradient(to right, transparent, #412369, transparent);  
}

/* posts */
.post {
    margin-left: 1em;
    margin-right: 1em;
}
.title {
}
.content {
    line-height: 1.4em;
}

.row {
  display: flex;
}

.column {
  flex: 50%;
}

.center {
    text-align: center;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.gray-note {
    font-size: 0.875em;
    color: #999;
}

blockquote {
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 50px;
  padding-left: 15px;
  border-left: 3px solid #ccc;
} 

h5 { font-size: medium; }

li { margin: 1em 0 0 1em; }

footer { margin: 1em; }