/* ========================================
   CATEGORY PAGE - SEO CONTENT SECTION
   (article text below the product cards)
======================================== */

.category-content {
    width: 100%;
    padding: 40px 0 90px;
}

.category-content-container {
    width: 1000px;
    max-width: calc(100% - 10%);
    margin: 0 auto;

    font-family: "Oxanium", sans-serif;
    font-size: 16px;
    line-height: 1.75;
    color: #000;
}

.category-content-container p {
    margin: 0 0 1.1em;
}

.category-content-container h1,
.category-content-container h2,
.category-content-container h3,
.category-content-container h4,
.category-content-container h5,
.category-content-container h6 {
    margin: 1.5em 0 0.6em;
    line-height: 1.35;
    color: #000;
}

.category-content-container > :first-child {
    margin-top: 0;
}

.category-content-container h1 { font-size: 30px; }
.category-content-container h2 { font-size: 26px; }
.category-content-container h3 { font-size: 23px; }
.category-content-container h4 { font-size: 20px; }
.category-content-container h5 { font-size: 18px; }
.category-content-container h6 { font-size: 16px; }

.category-content-container ul,
.category-content-container ol {
    margin: 0 0 1.1em;
    padding-left: 1.4em;
}

.category-content-container li {
    margin-bottom: 0.35em;
}

.category-content-container a {
    color: #a00079;
}

.category-content-container table {
    width: 100%;
    margin: 0 0 1.5em;
    border-collapse: collapse;
    font-size: 15px;
    background: #fff;
}

.category-content-container th,
.category-content-container td {
    padding: 10px 12px;
    border: 1px solid #e5d8cf;
    text-align: left;
    vertical-align: top;
}

.category-content-container th {
    background: #f7ece6;
}

/* ========================================
   RESPONSIVE
======================================== */

@media (max-width: 700px) {
    /* Category pages: break out of the .page 70px side padding so text gets the full width */
    .category-content {
        padding: 20px 0 60px;
    }

    .page .category-content {
        width: auto;
        margin: 0 -70px;
    }

    .category-content-container {
        width: calc(100% - 36px);
        max-width: none;
        font-size: 15px;
    }

    .category-content-container h1 { font-size: 24px; }
    .category-content-container h2 { font-size: 22px; }
    .category-content-container h3 { font-size: 20px; }
    .category-content-container h4 { font-size: 18px; }

    /* Wide tables scroll inside the section instead of the page */
    .category-content-container table {
        display: block;
        overflow-x: auto;
    }
}
