/** General styling (metrics and shared theming) **/

body {
    margin: 0px;
    padding: 0px;
    background-color: #eeeeee;
    font-family: Roboto, sans-serif;
    font-size: 16px;
}

header {
    position: relative;
    width: 100%;
    top: 0;
}

header > h1 {
    font-size: 20px;
    color: #888888;
    margin: 0px;
}

section {
    background-color: white;
    padding: 16px 0;
    margin-bottom: 16px;
    box-shadow: 0px 1px 4px #ccc;
}

h2 {
    font-size: 1em;
    padding-left: 1em;
    margin-top: 0px;
    color: #999999;
}

ol {
    list-style: none;
    margin-bottom: 0px;
    padding: 0;
}

ol > li {
    padding: 16px 16px 15px 16px;
    border-bottom: 1px solid #e6e6e6;
    transition: background-color .64s;
}

ol > li.tapped {
    background-color: #f0f0f0;
}

ol > li:last-child {
    border-bottom-width: 0px;
}

h3 {
    font-size: 16px;
    font-weight: normal;
    margin: 0px;
    word-wrap:break-word;
}

li > p {
    font-size: 14px;
    margin: 0px;
    color: #999999;

    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

p.notice {
    display: block;
    margin: -16px 0 16px 0;
    background-color: #fff59d;
    padding: 8px 16px;
}

a {
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
}

footer {
    font-style: italic;
    font-size: .8em;
    padding: 8px 16px;
    color: #4d4d4d;
}

footer > aside {
    display: inline-block;
    float: right;
}

.rss, .twitter { display: none; }

/** Theme styling **/

.blue  header { background: #03a9f4; }
.green header { background: white; }

.blue  a, .blue  ol > li.tapped a { color: #0091ea; }
.green a, .green ol > li.tapped a { color: #1b9b00; }