/* For both .category and .tag #main */
.category #main, .tag #main {
    display: flex;
    flex-wrap: wrap; /* Allow wrapping of articles */
    gap: 50px 20px;  /* Optional: space between items */
    float: none;
    justify-self: center;
    max-width: 1130px;
    padding-bottom: 100px;
}

.archive #main > article:first-of-type {
    margin-left: -20px;
}

/* Posts in both .category and .tag */
.category #main .post, .tag #main .post {
    flex: 0 1 30%;
    box-sizing: border-box;
    position: relative;
    background-color: #f9f9f9 !important;
    padding: 30px 20px;
    min-height: 350px;
    top: 300px;
}

/* Responsive Design for smaller screens */
@media (max-width: 768px) {
    .category #main, .tag #main {
        flex-direction: column; /* Stack items vertically on smaller screens */
        justify-content: center;
        width: 90%;
    }

    .category #main .post, .tag #main .post {
        flex: 0 1 100%; /* Take full width on small screens */
    }
}

/* Page title styling for both .category and .tag */
.category h1.page-title, .tag h1.page-title {
    width: 100%;
}

/* Entry title styling for both .category and .tag */
.category h3.h2.entry-title a, .tag h3.h2.entry-title a {
    color: #3e032c !important;
    font-size: 21px;
}

.category h3.h2.entry-title, .tag h3.h2.entry-title {
    line-height: 30px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2;
    min-height: 65px;
    margin-bottom: 20px;
}

/* "Read More" button for both .category and .tag */
.category a.excerpt-read-more, .tag a.excerpt-read-more {
    font-size: 17px;
    background: #3e032c;
    padding: 13px 20px;
    color: white;
    border-radius: 30px;
    font-weight: bold;
    text-transform: uppercase;
    position: absolute;
    bottom: 20px;
    left: 20px;
}

/* Byline (author info) styling for both .category and .tag */
.category p.byline.entry-meta.vcard, .tag p.byline.entry-meta.vcard {
    display: none;
}

/* Content styling for both .category and .tag */
.category .entry-content p, .tag .entry-content p {
   margin: 0px;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   overflow: hidden;
   -webkit-line-clamp: 5;
}

/* Hide images in posts for both .category and .tag */
.category #main .post > img, .tag #main .post > img {
    display: none !important;
}

.category article img, .tag article img {
    display: none;
}

/* Sidebar hiding for both .category and .tag */
.archive div#sidebar1 {
    display: none;
}

/* Pagination styling for both .category and .tag */
.archive nav.pagination {
    width: 100%;
}

/* Background image for page title in both .category and .tag */
.archive h1.page-title, .tag h1.page-title {
    background-image: url(https://www.optionsforsexualhealth.org/wp-content/uploads/2019/02/Knowing.jpg?id=483) !important;
    width: 100% !important;
    max-width: 100%;
    position: absolute;
    left: 0px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 140px 0px 50px 0px;
    text-align: center;
    color: white;
}

/* Optional: for mobile responsiveness */
@media (max-width: 768px) {
    .category h1.page-title, .category h1.page-title {
        top: 190px;
        padding: 50px 0px 50px 0px;
    }

    .category #main .post, .tag #main .post {
        top: 200px;
    }

    .category #main, .tag #main {
        gap: 20px;
    }
}

/* Padding adjustment for specific categories and tags */
.category-19 #main, .category-29 #main, .category-34 #main, .category-37 #main, .category-46 #main,
.tag-19 #main, .tag-29 #main, .tag-34 #main, .tag-37 #main, .tag-46 #main {
    padding-bottom: 300px;
}