/* Mobile responsive layer.
   all.css was built for a JS-driven "tiny/small/medium/large" body class
   with no real @media queries, and we force those classes' desktop rules
   on unconditionally (see the <style> block in header.php) so the site
   works without that legacy script. This file adds the missing small-
   screen behavior back in as a real media query, covering only the
   components this site's pages actually use. */

@media (max-width: 767px) {

    html, body { overflow-x: hidden; }
    #wrapper { width: 100%; max-width: 100%; overflow-x: hidden; }

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

    /* header: recreate the site's own compact "small" header instead of
       the desktop bar - logo + Subscribe/Login/E-Newsletters on row one,
       Show Topics / Full Site / search icon on row two. */
    .header {
        height: auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        border-bottom: thin solid #ccc;
        padding: 8px 15px;
    }

    .logo,
    .subscribe-animation,
    .enewsletters.join,
    .icon-facebook, .icon-twitter, .icon-instagram, .icon-rss {
        display: none;
    }
    .gotomenu { display: none; }

    .smalllogo {
        display: block;
        position: static;
        order: 1;
        flex: 1 0 auto;
    }

    .join-simple {
        display: block;
        order: 2;
        text-transform: uppercase;
        font-size: 10px;
        font-weight: bold;
        color: #848484;
        letter-spacing: .02em;
    }
    .join-simple a { color: #848484; }

    .header-mobile-row2 {
        order: 1;
        flex: 1 0 100%;
        display: flex;
        align-items: center;
        margin-top: 8px;
        position: absolute;
        right: 10px;
        top: 20px;
    }
    #navigation-pulldown-buttons {
        position: static;
        display: flex;
        align-items: center;
        flex: 0 1 auto;
        min-width: 0;
    }
    #navigation-pulldown-show, #navigation-pulldown-full-site {
        width: auto;
        float: none;
        margin-left: 0;
        flex: 0 0 auto;
        min-width: 0;
    }
    #navigation-pulldown-show a,
    #navigation-pulldown-full-site a {
        display: block;
        background: linear-gradient(0deg, #8d8d8d, #f1f1f1);
        border: thin solid #ccc;
        border-radius: 3px;
        color: #888888;
        text-transform: uppercase;
        font-size: 10px;
        font-weight: bold;
        text-align: center;
        white-space: nowrap;
        padding: 6px 10px;
    }
    #navigation-pulldown-show { margin-right: 8px; }

    .search, form[action*="/pw/search/"], .search-button { display: none; }
    .icon-searchsmall {
        display: block;
        position: static;
        margin-left: 8px;
        flex: 0 0 auto;
        width: 24px;
        height: 24px;
    }

    /* primary nav: collapsed behind "Show Topics" until toggled open */
    #navigation-menu { display: none; }
    #navigation-menu.nav-open { display: block; }
    #navigation-tabs {
        height: auto;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
    }
    .navigation-tab, .navigation-separator, .navigation-filler {
        float: none;
        display: inline-block;
    }
    #navigation-subnav-container {
        overflow: visible;
        white-space: normal;
    }
    .navigation-subnav-item, .navigation-subnav-item-divider { float: none; display: inline-block; }

    /* main content: stack the two columns instead of floating side by side */
    #content-main, #content-right {
        float: none;
        width: auto !important;
    }

    .right-column-module {
        float: none !important;
        width: auto !important;
        margin: 0 0 15px 0 !important;
    }
    .right-column-skyscraper-container { display: none; }

    /* homepage feature blocks: stack instead of absolute-positioning side by side */
    #home-featured {height: auto !important;}
    #home-featured-left, #home-featured-right {
        position: static;
        width: auto;
        margin: 0 0 15px 0;
    }

    /* promo/news grids: stack columns */
    .home-table-row {display: flex;flex-direction: column;}
    .home-table-cell, .home-table-cell-2, .home-table-cell-3 {
        float: none;
        width: auto;
        margin: 0 0 20px 0;
        padding-right: 0;
        border-bottom: 1px solid #ccc;
        padding-bottom: 0px;
    }

    /* footer: hide the full topic sitemap, show the compact social/links/copyright footer */
    .bottom-nav-container { display: none; }

    .social-small {
        display: block;
        text-align: center;
        margin-bottom: 15px;
    }

    .footer-nav {
        text-align: center;
    }

    .footer-tmks {
        text-align: center;
    }

    #content {
        overflow: unset;
        /* padding-right: 15px; */
    }
    #content-main {
        padding-right: 15px;
    }
    .hide-desktop {
    display: block;
}
.subtopic-recent-headlines-home-view-all {
    display: none;
}
.pwselect-cover-flow {
    display: none;
}
.mobile-hide {
    display: none;
}
.subtopic-recent-headlines-home {
    height: auto;
}

.home-blog-posts {
    height: auto;
}

#bottom-ad {
    display: none;
}



}