/*
Theme Name: Alpha's Manifesto
Theme URI: https://github.com/AlphaGit/alphasmanifesto
Description: Minimalist black and white theme developed from Alpha's Manifesto blog.
Author: Alpha
Author URI: http://alphasmanifesto.com/
Version: 0.2
Tags: black, gray, white, light, one-column, left-sidebar, fixed-layout, responsive-layout, featured-images, sticky-post, theme-options, threaded-comments, custom-background, responsive-layout

License: MIT
License URI:

Some comments for the future.
*/

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, menu, nav, section {
    display: block;
}
body {
    font-size: 16px;
    line-height: 1;
}
ol, ul {
    list-style: none;
}

q {
    quotes: none;
}

    q:before, q:after {
        content: '';
        content: none;
    }

blockquote {
    background: #eee;
    quotes: "\201C""\201D""\2018""\2019";
    padding: 2em 1em 1em 2em;
    font-style: italic;
    margin-bottom: 1em;
}

    blockquote:before, blockquote:after {
        color: #bbb;
        font-size: 6em;
        line-height: 0.1em;
    }

    blockquote:before {
        content: open-quote;
        vertical-align: -0.4em;
        margin-right: 0.1em;
    }

    blockquote:after {
        content: close-quote;
        vertical-align: -0.6em;
    }

    blockquote cite, blockquote q, blockquote em, blockquote var, blockquote i, blockquote p {
        font-style: normal;
        display: inline;
    }

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* generic elements */

*, *:before, *:after {
    box-sizing: border-box;
}

body {
    font: normal 1em/1.5 Georgia, serif;
    line-height: 1.5em;
}

ul {
    list-style-type: disc;
    padding-left: 1.5em;
}

    ul ul, ul ol, ol ul, ol ol {
        margin-bottom: 0;
    }

ol {
    list-style-type: decimal;
    padding-left: 1.5em;
}

a {
    color: blue;
    text-decoration: none;
}

cite, q, em, var, i {
    font-style: italic;
}

strong {
    font-weight: bold;
}

table {
    border: 1px solid black;
    margin: 1em 0;
    width: 100%;
}

tr.even {
    background-color: #EEE;
}

thead {
    font-weight: bold;
}

th {
    font-weight: bold;
    border: 1px solid black;
    padding: 1em;
    background-color: #888;
    color: #EBEBEB;
}

td {
    border: 1px solid black;
    padding: 1em;
}

dt {
    margin-top: 0.5em;
    font-style: italic;
}

dd {
    margin-top: 0.5em;
    padding-left: 1em;
}

abbr, acronym {
    border-bottom: 1px dotted black;
    cursor: pointer;
}

big {
    font-size: 1.2em;
}

code, kbd, tt {
    font-family: Consolas, "Courier New", Courier, monospace;
}

pre {
    font-family: Consolas, "Courier New", Courier, monospace;
    overflow-x: auto;
    margin-bottom: 1em;
    word-wrap: normal;
}

sub {
    font-size: 0.75em;
    bottom: -0.25em;
    position: relative;
}

sup {
    font-size: 0.75em;
    bottom: 0.5em;
    position: relative;
}

p, address, ul, ol, #post div, dl {
    margin-bottom: 1em;
}

    .trackback p {
        margin-bottom: 0;
    }

    p.wp-caption-text {
        margin-bottom: 0;
        font-size: 0.8em;
    }

article.columnContainer {
    margin-bottom: 1em;
    padding-bottom: 1em;
}

article {
    border-bottom: 2px solid #CCC;
}

    article:last-child {
        border-bottom: none;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    article h1 {
        font-family: georgia, 'times new roman', serif;
        font-size: 2em;
        line-height: 1em;
    }

        article h1 + * {
            margin-top: 1em;
        }

        article h1 + h2 {
            margin-top: 0.5em;
        }

            article p.subtitle {
                font-family: georgia, 'times new roman', serif;
                font-size: 1em;
                font-style: italic;
                font-variant: normal;
                font-weight: normal;
                margin-top: 0;
            }

h2 {
    font-size: 1.5em;
    font-family: georgia, 'times new roman', serif;
    font-weight: bold;
}

    article h2 {
        margin-top: 1em;
        margin-bottom: 0.2em;
        font-weight: bold;
        font-variant: small-caps;
        font-size: 1.5em;
    }

h3 {
    font-variant: small-caps;
    font-size: 1.17em;
    font-weight: bold;
}

h4 {
    font-size: 1em;
    font-variant: small-caps;
}

h5 {
    font-variant: small-caps;
    font-weight: bold;
    font-size: .83em;
}

h6 {
    font-size: .75em;
}

article address {
    font-style: italic;
}

article hr {
    margin: 2em auto;
}

article h1 a {
    text-decoration: none;
    color: black;
}

img, object, embed {
    max-width: 100%;
    height: auto;
}

/* header styles */

header {
    background: #444;
    -moz-box-shadow: 10px -5px 5px 10px #888;
    -webkit-box-shadow: 10px -5px 5px 10px #888;
    box-shadow: 10px -5px 5px 10px #888;
}

    header {
        border-bottom: none;
    }

    header h1 {
        color: white;
        font-size: 3em;
        line-height: 1em;
        word-wrap: break-word;
    }

        header h1 a {
            color: white;
            text-decoration: none;
        }

    header p.subtitle {
        color: #BBB;
        font-weight: normal;
        font-style: italic;
        word-wrap: break-word;
        font-size: 1.5em; /* TODO maybe this rule can be deleted */
        font-family: georgia, 'times new roman', serif;
        margin-bottom: 0;
    }

/* Grid styles */

.columnContainer {
    max-width: 1140px;
    margin: 0 auto;
    overflow: hidden;
    padding-top: 1em;
}

.column {
    display: inline-block;
    min-height: 1px;
    vertical-align: top;
}

    .column.colSize1 {
        width: 190px;
    }

    .column.colSize4 {
        width: 760px;
    }

    .column.colSize5 {
        width: 950px;
    }

.logoContainer {
    text-align: center;
}

/* Widget: general */
.widget {
    padding-top: 1em;
    padding-bottom: 1em;
    border-bottom: 2px solid #ccc;
}

    .widget:last-child {
        border-bottom: none;
    }

.widgettitle {
    font-size: 1.2em;
}

/* Widget: custom menu */
.widget ul {
    padding-top: 1em;
    padding-left: 0;
    font-size: 0.9em;
    list-style-type: none;
    margin-bottom: 0;
}

    .widget ul ul {
        list-style-type: none;
        padding-top: 0;
        padding-left: 0;
        font-size: 1em;
    }

        .widget ul ul ul {
            padding-left: 1em;
        }

    .widget ul li {
        border-top: 2px solid #ccc;
        padding-top: 1em;
        padding-bottom: 1em;
        overflow: hidden;
    }

        .widget ul li:last-child {
            padding-bottom: 0;
        }

        .widget ul li ul li {
            border: none;
            padding: 0;
        }

            .widget ul li ul li:before {
                content: "\21B3 ";
                vertical-align: text-bottom;
                font-size: 1.5em;
            }

            .widget ul li ul li:last-child {
                border: none;
            }

.widget th,
.widget td {
    padding: 0;
    text-align: center;
}

.titleRow {
    padding-top: 1em;
}

.leftSidebar {
    padding-right: 1em;
}

.menuSwitcher {
    display: none;
}

.title {
    padding: 0.5em 0;
    margin-bottom: 1em;
}

/* post styles */

.post {
    word-wrap: break-word;
}

.postContent {
    padding-right: 1em;
}

    .postContent > *:first-child {
        margin-top: 0; /* start post at top */
    }

.sticky {
    background-color: #F9FBFC;
}

/* post metadata */

article .metadata {
    font-size: 0.9em;
    margin-top: -0.4em; /* to compensate text baseline for different front-size in first line */
}

.metadata div {
    border-top: 2px solid #CCC;
    margin-top: 1em;
    padding-top: 1em;
}
    .metadata :first-child {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
    }

.share {
    margin-top: 0.5em;
}

.tags p {
    margin-top: 0;
}

footer.columnContainer {
    text-align: center;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    margin-top: 1em;
	margin-bottom: 1em;
    border-top: 2px solid #ccc;
    border-bottom: 2px solid #ccc;
}

    footer p {
        margin-bottom: 0;
    }

.date, .time {
    display: block;
}

/* comment section */
.comment-reply-title {
    margin-top: 1em;
}

.commentList {
    padding-left: 0;
}

.commentPagination {
    text-align: center;
    padding-top: 1em;
}

.comment,
.pingback {
    border-bottom: 2px solid #ccc;
    margin-top: 0;
    margin-bottom: 0;
    padding: 1em 0;
    list-style-type: none;
}

    .comment.bypostauthor .comment-body {
        background-color: #EEE;
    }

    .comment time, .comment .commentDate {
        font-size: 0.7em;
        line-height: 1em;
        display: block;
    }

    .comment:last-child,
    .pingback:last-child {
        border-bottom: none;
    }

        .commentList > .comment:last-child,
        .commentList > .pingback:last-child {
            border-bottom: 2px solid #ccc;
        }

.comment-body {
    min-height: 100px;
    position: relative;
}

    .comment-body p:first-of-type {
        margin-top: 0.5em;
    }

.comment-author,
.comment-awaiting-moderation {
    font-size: 0.9em;
    display: inline;
}

    .comment-author cite {
        font-weight: bold;
    }

    .comment-author img {
        width: 100px;
        float: left;
        margin-right: 1em;
    }

    .comment-author .says {
        display: none;
    }

.comment-meta {
    font-size: 0.8em;
    margin-right: 0.5em;
    position: absolute;
    top: 0;
    right: 0;
}

.comment .reply {
    font-size: 0.8em;
}

.comment-form {
    padding-top: 0;
    margin-top: 0;
    clear: both;
}

    .comment-form h3 {
        font-weight: bold;
        font-variant: small-caps;
        font-size: 1.3em;
        margin-bottom: 1em;
    }

    .comment-form label {
        font-weight: bold;
        font-size: 1em;
    }

    .comment-form input[type=text], 
    .comment-form textarea {
        width: 100%;
        font: normal 1em/1.5 Georgia, serif;
    }

.form-submit input[type=submit] {
    margin-top: 0;
    width: 100%;
    height: 50px;
    font-size: 1.5em;
}

#cancel-comment-reply-link {
    font-size: 0.8em;
    font-variant: normal;
    font-weight: normal;
    font-style: italic;
}

.comments-disabled,
.comments-no-comments {
    margin-top: 1em;
    text-align: center;
    font-style: italic;
}

ul.children {
    padding-left: 4em;
}

.alignright {
    float: right;
    margin-left: 10px;
}

.alignleft {
    float: left;
    margin-right: 10px;
}

.aligncenter {
    text-align: center;
}

.wp-caption {
	border: 1px solid rgb(170, 170, 170);
	margin: 0 0 1em 0;
	background-color: rgb(238, 238, 238);
	padding: 5px;
	text-align: center;
    max-width: 100%;
}

    h1 + .wp-caption {
        margin-top: 1em;
    }

    .wp-caption.aligncenter {
        margin-right: auto;
        margin-left: auto;
    }

    .wp-caption.alignleft {
        margin-right: 10px;
    }

    .wp-caption.alignright {
        margin-left: 10px;
    }

    .wp-caption.alignnone {

    }

.wp-caption-dd {
	font-size: 0.8em;
}

/* Text meant only for screen readers. */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000; /* Above WP toolbar. */
}

.wp-editor {
    margin: 1em;
}

.gallery {
    /* using important rules because wordpress writes inline styles for galleries and while
    they can be deactivated, that will remove ALL styles that wordpress uses for them*/
    margin-bottom: 1em !important;
}

.gallery-caption { }

.size-auto, 
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
    max-width: 100%;
    height: auto;
}

/* Search form and search results */
header .searchForm .searchSubmit,
header .searchForm label {
    display: none;
}

article .searchForm label {
    font-weight: bold;
}

.searchHeader {
    background-color: #eee;
    padding: 1em;
}

/* Fixes for general embeds */
article iframe, article video, article embed {
    width: 100%;
}

/* Fixes for twitter embeds */
.twitter-tweet-rendered {
    width: 100% !important;
}

/* Fixes for github gists */
.gist .gist-file {
    line-height: 1.2em;
    font-size: 13px;
}

.gist table {
    border: none;
    margin: 0;
}

.gist .line-pre {
    overflow-x: initial;
}

.gist table td {
    border: none;
}

/* Grid styles, mobile */
/* everything above this: 6 columns (1140px and above) */

/* 5 columns (1139px and below) */
@media print, only screen and (max-width: 1159px) { /* 1140px + 20px scrollbars */
    /* collapse metadata column under post */
    .column.metadata {
        display: block;
        width: auto;
        max-width: 760px; /* max size of colSize4 */
        border-top: 2px solid #CCC;
        padding-top: 1em;
        margin-right: 2em;
        margin-left: 2em;
        margin-top: 1em;
    }

    .metadata div {
        border: none;
        display: inline;
        margin-right: 0.5em;
    }

    /* display metadata content inline */
    .permalink,
    .datetime,
    .date,
    .time {
        display: inline;
    }

        .datetime:after,
        .categories:after,
        .permalink:after {
            content: " ―";
        }

    /* make post content and metadata be aligned at the right of the left sidebar */
    .column.postContainer {
        max-width: 760px; /* max size of colSize4 */
    }

    /* dismiss search */
    .searchContainer {
        display: none;
    }

    /* adjust size of columns to next breakpoint */
    .columnContainer {
        max-width: 950px;
    }
}

/* 4 columns (949px and below) */
@media print, only screen and (max-width: 969px) { /* 950px + 20px scrollbars */
    /* collapse sidebar on top of postContainer column */
    .titleRow,
    .leftSidebar,
    .postContainer {
        display: block;
        margin: 0 auto;
        max-width: 760px;
    }
    
    /* make all columns the same size */
    .columnContainer {
        max-width: 760px;
    }

    .column.colSize1,
    .column.colSize4,
    .column.colSize5 {
        margin: 0 auto;
        width: 760px;
        padding-left: 0;
        padding-right: 0;
    }

        .column.colSize1.metadata {
            width: auto;
            margin-left: 2em;
            margin-right: 2em;
        }

    /* add a border between the sidebar and the posts */
    .leftSidebar {
        padding-bottom: 1em;
        border-bottom: 2px solid #ccc;
    }

    /* collapse menu and show option to display it */
    label.menuSwitcher {
        display: block;
        font-size: 1.2em;
    }

        label.menuSwitcher:before {
            content: "\25B6  Display menus";
        }

        .widget {
            display: none;
        }

    #displayMenus:checked + label.menuSwitcher:before {
        content: "\25BC  Hide menus";
    }

        #displayMenus:checked ~ .widget {
            display: block;
        }
}

@media only screen and (max-width: 779px) { /* 760px + 20px scrollbars */
    /* make columns fluid and hope for the best */
    .columnContainer,
    .column.colSize1,
    .column.colSize4,
    .column.colSize5 {
        max-width: 100%;
        width: auto;
        display: block;
    }

        /* we still don't want the search box */
        .column.colSize1.searchContainer {
            display: none;
        }

    .columnContainer {
        margin-left: 1em;
        margin-right: 1em;
    }

        .columnContainer .columnContainer {
            margin-left: 0;
            margin-right: 0;
        }
}

@media print {
    /* hide stuff that's no use when printed or that takes too much space */
    label.menuSwitcher,
    .logoContainer {
        display: none;
    }
}