

.ballot_box_with_check:before {
  content: "\2611\ ";
}

.ballot_box:before {
  content: "\2610\ ";
}


* {
    margin: 0;
    padding: 0;
    font-family: 'Space Mono', monospace;
}

body {
    background-color: #222;
    color: #edb03d;
    font-weight: bold;
    font-size: 1.2em;
    padding-top: 1em;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Overpass Mono', monospace;`
    padding: 0.5em;
    text-align: center;
}

h1 {
    font-size: 3em;
}

h2 {
    font-size: 2.5em;
}

h3 {
    font-size: 2em;
}

h4 {
    font-size: 1.7em;
}

h5 {
    font-size: 1.5em;
}

a {
    color: #c43;
    text-decoration: none;
}

a:hover {
    color: red;
}

ul.pagination {
    display: block;
    text-align: center;
}

ul.pagination li {
    display: inline-block;
    width: 3em;
    margin-right: -0.6em;
}

ul.pagination li a {
    color: gold;
    display: inline-block;
    width: 100%;
    height: 100%;
}

ul.pagination li::before {
    color: green;
    margin-bottom: -1.1em;
    content: "+---+\00000a\000A6     ";
    line-height: 0.9em;
    float: left;
    white-space: pre;
}

ul.pagination li::after {
    color: green;
    margin-top: -1.2em;
    content: "    \000A6\00000a+---+";
    line-height: 0.9em;
    float: right;
    white-space: pre;
}

ul.pagination li a:hover {
    color: yellow;
}

/*ul.pagination li::before a:hover {
    color: yellow;
}

ul.pagination li::after a:hover {
    color: yellow;
}*/


ul.pagination li.active a {
    /*color: #ed0;*/
    color: yellow;
}

ul.pagination li.active::before,
ul.pagination li.active::after {
    /*color: #ed0;*/
    color: lightgreen;
}

ul.repo-list {
    list-style-type: none;
}

ul.repo-list li a::before {
    content: "\02446";
}

header, div.menu, div.content-wrapper {
    /*font-family: monospace;*/
    position: relative;
    left: 50%;
    margin-left: -40ch;
    width: 80ch;

}

header {
    text-align: center;
    white-space: pre;
    margin-bottom: 3ch;
    color: gold;
}

header pre {
    line-height: 1em;
}

dl.definition {
    /*font-family: monospace;*/
    position: relative;
    left: 50%;
    margin-left: -30ch;
    width: 60ch;
    padding-bottom: 2em;
}
dl.definition dd {
    font-style: italic;
}

div.content-wrapper::before, div.content-wrapper::after {
    content: "+---------------------------------------------------------------------------------------------------------+";
    white-space: pre;
}

div.menu {
    padding-left: 3ch;
}

div.menu > a {
    white-space: pre;
    text-decoration: none;
    display: inline-block;
    margin-left: -2ch;
}
div.menu > a > span {
    color: gold;
    display: inline-block;
    text-align: center;
    width: 20ch;
}
div.menu > a:hover > span {
    color: yellow;
}

div.menu > a::before {
    content: " --------------------\00000a/";
    color: green;
    background-color: #222;
    position: relative;
    top: 0; left: 0;
    white-space: pre;
    z-index: -2;
}
div.menu > a::after {
    content: "\\";
    color: green;
    position: relative;
    top: 0; left: 0;
    white-space: pre;
}

div.menu a.active,
div.menu a.active span {
    color: yellow;
    font-weight: bold;
    background-color: #222;
    z-index: 20;
}

div.menu > a.active::before {
    color: lightgreen;
    background-color: #222;
    z-index: 15;
}

div.menu > a.active::after {
    content: "\\";
    color: lightgreen;
    background-color: #222;
    position: relative;
    top: 0; left: 0;
    white-space: pre;
}

div.content {
  padding: 3ch;
}

div.content-wrapper {
  overflow: hidden;
  margin-bottom: 100px
}

div.content::before {
    content: "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a";
    position: absolute;
    top: 0; left: 0;
    white-space: pre;
}

div.content::after {
    content: "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a"
  "|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a";
    position: absolute;
    top: 0; right: 0;
    white-space: pre;
}

/*div.content p {
    display: block;
}

div.content p::before { 
    content: "|";
}

div.content p::after { 
    content: "|";
}
*/

body > footer {
    /*font-family: monospace;*/
    position: fixed;
    width: 100%;
    bottom: 0;
    /*height: 2em;*/
    background: #222;
}

body > footer::before,
body > footer::after {
    content: "----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------";
    white-space: pre;
}

body > footer > div.copy {
    float: left;
    padding: 0.3em;
    margin-left: 1em;
}

body > footer > div.links {
    float: right;
    padding: 0.3em;
    margin-right: 1em;
}
/* &#9776; */
body > footer > div.links span::before {
    content: "| ";
    white-space: pre;
}

body > footer > div.links a {
    text-decoration: none;
    color: green;
}

body > footer > div.links a:hover {
    color: lightgreen;
}

div#test {
    /*font-family: monospace;*/
    font-size: 3em;
    color: white;
}

div.third-column {
    position: relative;
    float: left;
    width: 33%;
}

div.third-column ul {
    display: block;
    margin: 1em;
    padding: 0;
    list-style: none;
}

div.third-column ul li {
    padding-bottom: 1em;
}

.center-block {
    position: relative;
    text-align: center;
    left: 25%;
    width: 50%;
}

.form-group {
    text-align: left;
    clear: both;
    margin-top: 1em;
}

.form-group button {
    color: #333;
    background-color: #edb03d;
    font-size: 1em;
    padding: 0.2em 2em;
    height: 2em;
    line-height: 1.6em;
    /*font-family: monospace;*/
    float: right;
}

.form-control {
    border: dashed #edb03d 1px;
    color: #ccc;
    background-color: #444;
    /*font-family: monospace;*/
    padding: 0.2em;
    font-size: 1.2em;
    width: 100%;
}

#form-group-subject {
    display: none;
}

svg.js-calendar-graph-svg text {
    fill: gold;
    padding: 2px;
    font-size: 55%;
}
/* svg.js-calendar-graph-svg rect {
  transform-box: fill-box;
  transform-origin: center;
  transform: rotate(55deg) scale(0.75, 0.75);
} */
svg.js-calendar-graph-svg circle[data-level="0"] {
    fill: rgba(255, 215, 0, 0.2);
}
svg.js-calendar-graph-svg circle[data-level="1"] {
    fill: rgba(255, 215, 0, 0.4);
}
svg.js-calendar-graph-svg circle[data-level="2"] {
    fill: rgba(255, 215, 0, 0.6);
}
svg.js-calendar-graph-svg circle[data-level="3"] {
    fill: rgba(255, 215, 0, 0.8);
}
svg.js-calendar-graph-svg circle[data-level="4"] {
    fill: rgba(255, 215, 0, 1);
}

label#mobile-menu-trigger {
    display: none;
    position: absolute;
    color: black;
    background-color: #edb03d;
    top: 15px;
    left: 15px;
    padding: 0.04em;
    font-size: 2.5em;
    line-height: 1em;
}

div#mobile-menu {
    display: none;
    position: absolute;
    width: 250px;
    display: inline-block;
    top: 1em;
    left: -500px;
    padding: 2em 2em 2em 3em;
    background-color: #222;
    z-index: 1000;
    overflow: hidden;
    transition: left 0.5s;
}

div#mobile-menu::before {
    content: "-------------------------------+\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a|\00000a";
    text-align: right;
    color: yellow;
    background-color: #222;
    position: absolute;
    top: 0;
    right: 0;
    white-space: pre;
    z-index: -2;
}

div#mobile-menu::after {
    content: "-------------------------------+";
    color: yellow;
    background-color: #222;
    position: absolute;
    bottom: 0;
    right: 0;
    white-space: pre;
    z-index: -2;
}

div#mobile-menu label {
    display: block;
    position: absolute;
    font-size: 3em;
    top: 0;
    right: 0.2em;
}

div#mobile-menu a {
    clear: both;
    color: gold;
    text-decoration: none;
    display: block;
    text-align: center;
    height: 2em;
    line-height: 2em;
    margin: 0;
}

div#mobile-menu a::before {
    float: left;
    line-height: 1em;
    content: "+-------------------+\00000a|\00000a|";
    text-align: left;
    color: green;
    margin-bottom: -2em;
    white-space: pre;
}

div#mobile-menu a::after {
    float: right;
    line-height: 1em;
    content: "|\00000a|\00000a+-------------------+";
    text-align: right;
    color: green;
    margin-top: -2em;
    white-space: pre;
}

div#mobile-menu a.selected {
    color: yellow;   
}
div#mobile-menu a.selected::before,
div#mobile-menu a.selected::after
{
    color: lightgreen;
}

div#mobile-menu a:hover {
    color: yellow;
}

div#mobile-menu a:first-child {
    margin-top: 1em;
}

div#mobile-menu a:hover span::before {
    color: gold;
    content: "> ";
}

div#mobile-menu a:hover span::after {
    color: gold;
    content: " <";
}

#mobile-menu-control {
    display: none;
}

#mobile-menu-control:checked + label {
    display: none;
}

#mobile-menu-control:checked ~ div#mobile-menu {
    /*display: block;*/
    left: -1em;
    /*width: 70px;*/
    /*height: 74px;*/
}

pre.headshot-ascii {
    font-size: 0.74em;
}

.gist{font-size:13px;line-height:18px;margin-bottom:20px;margin:1em;}
.gist .blob-code-inner, .gist .pl-smi, .gist .pl-s .pl-s1{color:#eee !important;}
.gist .gist-file, .gist .gist-data {border-color: transparent !important; background-color: #292929 !important;}
.gist pre{font-family:Menlo,Monaco,'Bitstream Vera Sans Mono','Courier New',monospace !important}
.gist-meta{font-family:Helvetica,Arial,sans-serif;font-size:13px !important; background-color: rgb(50,50,50) !important}
.gist-meta a{color:#26a !important;text-decoration:none}
.gist-meta a:hover{color:#0e4071 !important}
.js-file-line-container { background-color: transparent !important; }
.gist .pl-s, .gist .pl-pds, .gist .pl-s .pl-pse .pl-s1, .gist .pl-sr, .gist .pl-sr .pl-cce, .gist .pl-sr .pl-sre, .gist .pl-sr .pl-sra { color: #99d !important; }
.js-line-number {background-color: rgb(50,50,50) !important}
.js-line-number::before {color: #aaa !important;}

svg.js-calendar-graph-svg {
    /*background-color: #555;*/
    padding: 5px;
    width: 100%;
}

.js-calendar-graph-svg .wday,
.js-calendar-graph-svg .month {
    font-family: "Overpass Mono", monospace;
    fill: #edb03d;
    font-size: 12px;
}

.js-calendar-graph-svg rect[data-count="0"] {
    opacity: 0.2;
}

@media only screen and (min-width : 769px) and (max-width : 1024px) {
    header, div.menu, div.content-wrapper {
        width: 70ch;
        margin-left: -35ch;
    }
    div.third-column {
        width: 50%;
    }
}

@media only screen and (max-width : 768px) {
    body > header > pre {
        display: none;
    }
    body > header::after {
        color: gold;
        display: inline-block;
        content: "Yb  dP  dP\"\"b8 .dP\"Y8 88\"\"Yb 8888P\00000a  YbdP  dP   `\" `Ybo.\" 88__dP   dP \00000a  dPYb  Yb      o.`Y8b 88\"Yb   dP  \00000adP  Yb  YboodP 8bodP' 88  Yb d8888";
        white-space: pre;
        line-height: 1em;
    }
    div.menu {
        display: none;
    }
    header, div.content-wrapper {
        width: 100%;
        left: 0;
        margin-left: 0;
    }
    div.mobile-menu::after {
        content: "&#9776;";
        color: white;
    }
    div.menu > div {
        display: none;
    }
    div.third-column {
        width: 100%;
        max-height: 500px;
        overflow: hidden;
    }
    dl.definition {
        display: none;
    }
    div.center-block {
        left: 5%;
        width: 90%;
    }
    label#mobile-menu-trigger {
        display: block;
    }
    div#mobile-menu {
        display: block;
    }
    body > footer > div.copy {
        float: none;
        clear: both;
        width: 100%;
        text-align: center;
        margin: 0;
        padding: 0;
    }
    body > footer > div.links {
        float: none;
        clear: both;
        text-align: center;
        padding: 0;
        margin-right: 0;
    }
    body > footer > div.links span::before {
        content: "";
        white-space: pre;
    }
    div#github-activity-display {
        display: none;
    }
}

@media only screen and (max-width : 555px) {
    body > header::after {
        font-size: 75%;
        float: right;
    }
    #mobile-menu-control {
        font-size: 75%;
    }
    label#mobile-menu-trigger {
        font-size: 2em;
    }
}
