/*
Theme Name: Oregon ArtsWatch
Text Domain: oaw
Version: 1.0.0
Description: Theme for orartswatch.org
Tags: news, responsive
Author: Oregon ArtsWatch
Author URI: orartswatch.org
*/
/* -------------------------------------------------- */

/* VARIABLES */
:root {
    --oaw-green: #577e47;
    --oaw-gray-100: #eee;
    --oaw-gray-200: #d3d3d3;
    --oaw-gray-hover: #555;
    --oaw-gray-300: #333;
    --oaw-gray-400: #222;
    --oaw-gray-500: #111;
    --oaw-darkmode-bg: #020202;
    --oaw-sans: 'Source Sans 3', sans-serif;
    --oaw-serif: 'Noto Serif', serif;
}

/* LAYOUT: HEADER, MAIN, FOOTER, ARTICLE */
* {
    margin: 0;
}

body {
    width: 100%;
    max-width: 100%;
    min-height: 100vh;
    overflow-x: hidden;
}

#oaw-body {
    display: grid;
    gap: 20px;
    scroll-margin-top: 45px !important;
}

header {
    grid-row: 1;
}

#oaw-header {
    position: fixed;
    top: 0;
    box-sizing: border-box;
    padding: 0;
    background-color: var(--oaw-gray-500);
    z-index: 1000;
    width: 100%;
    height: 45px;
    max-height: 45px;
    display: grid;
    grid-template-columns: 1fr minmax(auto, 1280px) 1fr;
    grid-template-rows: 1fr;
    color: white;
    transition: top 0.2s ease-in-out;
}

body.customize-support #oaw-header {
    top: 0;
}

#oaw-main {
    grid-row: 2;
    max-width: 1320px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

#oaw-main>* {
    max-width: 100%;
}

#oaw-footer {
    grid-row: 3;
    width: 100%;
    box-sizing: border-box;
    padding: 0 20px 20px;
    line-break: auto;
    overflow: hidden;
    font-size: 14px;
    line-height: 1.5;
    font-family: 'Source Sans 3', sans-serif;
}

#banner-ad-space {
    width: 100%;
    max-width: 1456px;
}

#banner-menu-space {
    display: none;
}

.oaw-block {
    background-color: #eee;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.oaw-sidebar {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.oaw-sidebar:has(*) {
    border-top: 1px solid var(--oaw-gray-200);
    padding-top: 32px;
}

img {
    width: 100%;
}

.img img {
    width: 100%;
    object-fit: cover;
}

.img-square img {
    aspect-ratio: 1/1;
}

.img-3-2,
.img-3-2 img {
    aspect-ratio: 4/3;
}

.img-4-3 img {
    aspect-ratio: 4/3;
}

.img-16-9 img {
    aspect-ratio: 16/9;
}

#oaw-main .oaw-section:first-child {
    padding-top: 0;
}

@media screen and (min-width: 783px) {
    #oaw-main .oaw-section:first-child {
        padding-top: 32px;
    }
}

.oaw-section {
    width: 100%;
    padding: 32px 0;
    border-bottom: 1px solid var(--oaw-gray-200);
}

.oaw-section .oaw-inner-section {
    padding: 24px 0;
    border-bottom: 1px solid var(--oaw-gray-200);
}

.oaw-section .oaw-inner-section:first-child {
    padding-top: 0;
}

.oaw-section .oaw-inner-section:last-child {
    padding-bottom: 0;
    border-bottom: none;
}

.oaw-columns {
    display: flex;
    flex-direction: column;
    gap: 24px;
    box-sizing: border-box;
}

.oaw-column1,
.oaw-column2,
.oaw-subcolumn1,
.oaw-subcolumn2 {
    width: 100%;
}

.oaw-underline {
    border-bottom: 1.5px solid black;
}



.sidebar-title {
    font-family: 'Source Sans 3', sans-serif;
    font-weight: 700;
    font-size: 24px;
}

.sidebar-headline {
    font-family: 'Source Sans 3', sans-serif;
    font-weight: 600;
    font-size: 16px;
}

.oaw-content {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.oaw-btn {
    border: none;
    border-radius: 5px;
    padding: 5px 10px;
    background-color: var(--oaw-gray-400);
    color: white;
    font-family: 'Source Sans 3', sans-serif;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
}

a:link.oaw-btn,
a:visited.oaw-btn {
    color: white;
    text-decoration: none;
}

.oaw-btn:hover {
    background-color: var(--oaw-gray-300);
}

.oaw-has-sidebar {
    display: grid;
    width: 100%;
    gap: 24px;
}

@media only screen and (min-width: 768px) {
    #oaw-body {
        grid-template-rows: auto 1fr auto;
    }

    .oaw-columns {
        flex-direction: row-reverse;
    }
}

@media only screen and (min-width: 992px) {
    #hp-main {
        padding: 20px;
    }

    .ad-wrap {
        display: none;
    }

    .oaw-has-sidebar {
        grid-template-columns: 1fr minmax(150px, 300px);
    }

    .oaw-content {
        grid-column: 1;
        width: 100%;
        padding-right: 24px;
        border-right: 1px solid var(--oaw-gray-200);
        box-sizing: border-box;
    }

    .oaw-sidebar {
        grid-column: 2;
        border-top: none;
        padding-top: 0;
    }

    #top-banner {
        display: flex;
        gap: 20px;
    }

    #banner-menu-space {
        display: block;
        flex: 1;
    }
}



.oaw-story-list {
    display: flex;
    flex-direction: column;
}

hr {
    border: none;
    border-top: 1px solid var(--oaw-gray-200);
    color: var(--oaw-gray-200);
    overflow: visible;
    text-align: center;
    height: 1px;
}

@media print {
    #oaw-header,
    .oaw-ad,
    .oaw-ad-wrap,
    .oaw-sidebar,
    #respond,
    .oaw-newsletter-form,
    #oaw-read-more,
    .oaw-section:has(.menu-category-grid-container) {
        display: none;
    }
}