/* Color Palette */
:root {
    /* Grayscale */
    --gray-darker:    #0a0a0a;
    --gray-dark:      #101010;
    --gray-mid-dark:  #525252;
    --gray-mid:       #868686;
    --gray-mid-light: #a0a0a0;
    --gray-light:     #b9b9b9;
    --gray-white:     #f7f7f7;

    /* Colors */
    --blue: #1cccc0;
    --orange: #cca71c;
    --purple: #9a1ccc;
    --green: #1ccc33;
    --red: #cc1c27;
}

@font-face {
    font-family: "Toshiba MOD";
    font-weight: normal;
    src: url("/ToshibaSat8x14_MOD.woff") format('woff');
}

/* CSS variables: https://www.w3.org/TR/css-variables/ */

body {
    width: 700px;
    background-color: var(--gray-dark);
    color: var(--gray-light);
    font-weight: normal;
    font-family: Toshiba MOD, Roboto, Helvetica;
    font-size: 14px;
    line-height: 14px;
}

/* Home Bar */
.homeBar {
    font-size: 28px;
    line-height: 28px;
    color: var(--gray-light);
}

.homeSelection {
    color: var(--gray-mid-light)
}
.homeSelectionEntry {
    color: var(--gray-mid-dark);
    font-style: normal;
}
.homeSelectionEntry:hover {
    color: var(--orange);
}

/* Home: Article entries list */
.homeEntry {
    display: table;
    table-layout: fixed;
}

.homeEntry:after {
    content: "";
    display: table;
    clear: both;
}

/* Left Column */
.homeEntryDate {
    display: table-cell;
    color: var(--gray-mid-dark);
}

/* Right Column */
.homeEntryName {
    display: table-cell;
    text-align: left;
}



/* Website + Avatar */
.website {
    font-size: 28px;
    line-height: 28px;
    color: var(--gray-light);
}
.website:hover {
    color: var(--orange);
}

.surroundingPost {
    color: var(--gray-mid-dark);
}
.surroundingPost:hover {
    color: var(--orange);
}



/* Main article */
.title {
    font-size: 28px;
    line-height: 28px;
    color: var(--gray-white);
}

.date {
    padding-bottom: -20px;
    color: var(--gray-mid-dark);
}

img {
    display: block;

    text-align:    center;
    margin-left:     auto;
    margin-right:    auto;
    margin-top:      30px;
    margin-bottom:   20px;
}


/* General Formatting */

/* Bold for colored emphasis */
b {
    font-weight: normal;
    color: var(--red)
}

/* Italics for de-imphasis */
i {
    color: var(--gray-mid-dark);
    font-style: normal;
}

/* Strong for bright color */
strong {
    color: var(--gray-white);
    font-weight: normal;
    font-style: normal;
}

/* Links are just colored text. Color changes on mouse-over */
a:link,
a:visited,
a:active {
    text-decoration: none;
    color: var(--blue);
}
a:hover {
    text-decoration: none;
    color: var(--orange);
}

/* Code Block */
pre, pre>code {
    font-family: Toshiba MOD, Roboto, Helvetica;
    color: var(--gray-light);
	background-color: var(--gray-darker);
	padding: 0px 10px 10px 20px;
	overflow-x: auto;
	tab-size: 2;
}
/* Inline Code */
code {
    font-family: Toshiba MOD, Roboto, Helvetica;
    color:            #d9d9d9;
	background-color: #323232;
}

/* Lists: Less whitespace */
p+ul, p+ol {
	margin-top: -14px;
}
li {
	margin-left: -8px;
}

hr {
	margin: 18px 0px 18px 0px;
	height: 2px;
    border: none;
    background-color: var(--gray-white);
}

/* Article section */
h1 {
    color: var(--gray-white);
    margin-top: 40px;
    font-size: 28px;
    line-height: 28px;
    font-weight: normal;
}

/* Article subsection */
h2 {
    color: var(--gray-white);
    margin-top: 40px;
    font-size: 14px;
    line-height: 14px;
    font-weight: normal;
    display: inline;
}

/* Strikthrough text */
s {
    color: var(--gray-mid-dark)
}

audio { width: 700px; }
