:root {
    --cgr-text-color: #555;
    --cgr-text-color-dark: #222;
    --cgr-text-color-light: #888;
    --cgr-text-color-on-dark: #999;
    --cgr-text-color-disabled: #aaa;
    --cgr-text-color-on-accent: #eee;
    --cgr-text-color-accent: #2BA6CB;

    --cgr-link-color: #2BA6CB;
    
    --cgr-background-default:#f0f0f0;
    --cgr-background-medium: #e9e6e1;
    --cgr-background-light:#f6f6f6;
    --cgr-background-dark: #323A45;
    --cgr-background-accent: #2980B9;
    --cgr-background-highlight: #ddd;
    --cgr-background-block: #e3e1e1;

    --cgr-border-color-light: #ddd;

    --cgr-table-border-color: #aaa;
    --cgr-shadow-color: #c9c9cf;
}

.header nav {
    background-color: var(--cgr-background-dark)!important;
}

body {
    background-color: var(--cgr-background-default);
    color: var(--cgr-text-color);
}

#banner {
    background-color: var(--cgr-background-medium);
}
a {
    color: var(--cgr-link-color);
}

a:hover {
    color: var(--cgr-text-color);
    transition: all 0.2s ease-out;
}

.table-of-contents {
    background-color: var(--cgr-background-block);
}

.table-of-contents a {
    color: var(--cgr-text-color);
}

.table-of.contents a:hover {
    color: var(--cgr-link-color);
}

.table {
    color: var(--cgr-text-color);
}

.table th {
    background-color: var(--cgr-background-block);
}

.table tr:nth-child(even)  {
    background-color: var(--cgr-background-light);
}

code {
    background-color: var(--cgr-background-highlight);
    color: var(--cgr-text-color-dark);
}

blockquote {
    background-color:  var(--cgr-background-block);
    border-color: var(--cgr-text-color-accent);
    box-shadow: .25em .25em .5em var(--cgr-shadow-color);
}

.footnote-ref {
    background-color: var(--cgr-background-highlight);
}

.blog-date {
    background-color: var(--cgr-background-accent);
}

.post_link > a {
    color: var(--cgr-text-color);
}

.post_link > a:hover {
    color: var(--cgr-link-color);
    transition: all 0.2s ease-out;
}

.muted {
    color: var(--cgr-text-color-light);
}

#footer {
    background-color: var(--cgr-background-accent);
    color: var(--cgr-text-color-on-accent);
}

#footer2 {
    background-color: var(--cgr-background-dark);
    color: var(--cgr-text-color-on-dark);
}

.follow_us a { 
    color: var(--cgr-text-color-on-accent);
}

.follow_us a:hover {
    opacity: 1.0; 
    color: var(--cgr-text-color-on-accent);
}

.page-link {
    background-color: var(--cgr-background-light);
    color: var(--cgr-text-color);
    border-color: var(--cgr-border-color-light);
}

.active > .page-link {
    background-color: var(--cgr-background-accent);
    border-color: var(--cgr-border-color-light);
    color: var(--cgr-text-color-on-accent);
}

.disabled > .page-link {
    background-color: var(--cgr-background-light);
    color: var(--cgr-text-color-disabled);
    border-color: var(--cgr-border-color-light);
}