/* Site-level additions on top of the base stylesheet. */

body.custom-background {
    background-image: url("../img/bg-pattern.jpg");
    background-position: left top;
    background-repeat: repeat;
    background-attachment: scroll;
}

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

figure.post-image {
    margin: 26px 0;
}
figure.post-image img {
    display: block;
    width: 100%;
    height: auto;
}

#primary .entry-content h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 30px 0 12px;
    line-height: 1.35;
}
#primary .entry-content p { margin-bottom: 18px; }
#primary .entry-content ul {
    margin: 0 0 20px 22px;
    list-style: disc;
}
#primary .entry-content ul li { margin-bottom: 7px; }

.page-header .page-title {
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 6px;
}
.taxonomy-description p {
    margin: 0 0 26px;
    color: #6d6d6d;
}

.below-entry-meta .posted-on { color: #8a8a8a; font-size: 13px; }
.below-entry-meta .posted-on .fa { margin-right: 5px; }

.footer-nav {
    padding: 6px 0 10px;
    font-size: 13px;
    line-height: 2;
}
.footer-nav a { color: #ddd; }
#bottom-footer .copy-right { padding-top: 0; }

.post-navigation .nav-links { overflow: hidden; padding: 18px 0 4px; }
.post-navigation .nav-previous { float: left; max-width: 48%; }
.post-navigation .nav-next { float: right; max-width: 48%; text-align: right; }

@media (max-width: 600px) {
    .post-navigation .nav-previous,
    .post-navigation .nav-next { float: none; max-width: 100%; text-align: left; margin-bottom: 10px; }
}

/* mobile: give the list links a real tap area */
@media (max-width: 767px) {
    #secondary .widget ul li a,
    .footer-nav a,
    #site-navigation .menu li a { display: inline-block; padding-top: 7px; padding-bottom: 7px; }
    #secondary .widget ul li { line-height: 1.4; }
}

/* figure caption under a post image */
figure.post-image figcaption {
    margin-top: 8px;
    font-size: 13px;
    color: #6d6d6d;
    line-height: 1.5;
}

/* payout table */
.payout-table {
    width: 100%;
    border-collapse: collapse;
    margin: 8px 0 26px;
    font-size: 15px;
}
.payout-table caption {
    caption-side: top;
    text-align: left;
    font-size: 13px;
    color: #6d6d6d;
    padding-bottom: 8px;
}
.payout-table th,
.payout-table td {
    padding: 9px 12px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid #e6e6e6;
}
.payout-table thead th {
    background: #2d2d2d;
    color: #fff;
    font-weight: 500;
    border-bottom: none;
}

/* on a phone every row becomes its own small card */
@media (max-width: 600px) {
    .payout-table caption { display: block; }
    .payout-table thead { position: absolute; left: -9999px; }
    .payout-table,
    .payout-table tbody,
    .payout-table tr,
    .payout-table td { display: block; width: 100%; }
    .payout-table tr {
        margin-bottom: 14px;
        border: 1px solid #e6e6e6;
    }
    .payout-table td { border-bottom: 1px solid #f0f0f0; padding: 8px 12px; }
    .payout-table td:last-child { border-bottom: none; }
    .payout-table td::before {
        content: attr(data-label);
        display: block;
        font-size: 12px;
        color: #8a8a8a;
        margin-bottom: 2px;
    }
}

/* the lead image sits directly under the post meta */
figure.post-image.lead-image { margin-top: 4px; margin-bottom: 30px; }

/* the base stylesheet leaves 36px titles on a 26px line box: two-line headings collide */
#primary h1.entry-title,
#primary h2.entry-title { line-height: 1.22; }
#primary .page-header .page-title { line-height: 1.25; }