/*
 * SkyNext Mobile Repair - noithatphangia.com
 * Version 1.0.0
 * Fix legacy fixed-width article layouts on phones.
 */

@media (max-width: 767px) {

    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }

    /* Main site/article wrappers commonly used by legacy WordPress themes */
    body #page,
    body #wrapper,
    body .wrapper,
    body .site,
    body .site-content,
    body #content,
    body .content,
    body .content-area,
    body #primary,
    body #main,
    body .main,
    body .main-content,
    body .page-wrapper,
    body .single-wrapper,
    body .post-wrapper,
    body article,
    body .post,
    body .hentry,
    body .entry,
    body .entry-content,
    body .post-content,
    body .single-content,
    body .single-post-content,
    body .article-content,
    body .blog-content {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    /* Restore a readable mobile gutter */
    body .entry-content,
    body .post-content,
    body .single-content,
    body .single-post-content,
    body .article-content,
    body .blog-content {
        padding-left: 16px !important;
        padding-right: 16px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Legacy grids / bootstrap */
    body .container,
    body .container-fluid {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    body .row {
        width: auto !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body [class^="col-"],
    body [class*=" col-"],
    body [class^="span"],
    body [class*=" span"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        float: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    /* Remove legacy fixed widths/offsets inside article */
    body .entry-content *,
    body .post-content *,
    body .single-content *,
    body .single-post-content *,
    body .article-content *,
    body .blog-content * {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body .entry-content p,
    body .entry-content h1,
    body .entry-content h2,
    body .entry-content h3,
    body .entry-content h4,
    body .post-content p,
    body .post-content h1,
    body .post-content h2,
    body .post-content h3,
    body .single-content p,
    body .single-post-content p,
    body .article-content p,
    body .blog-content p {
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;
        overflow-wrap: break-word;
        word-wrap: break-word;
    }

    /* Images/media */
    body img,
    body video,
    body iframe,
    body embed,
    body object,
    body svg,
    body figure,
    body .wp-caption,
    body .wp-caption img,
    body .gallery,
    body .gallery-item {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body img,
    body video {
        height: auto !important;
    }

    body .aligncenter,
    body img.aligncenter,
    body .wp-caption.aligncenter {
        display: block !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Tables and long content should scroll inside themselves */
    body .entry-content table,
    body .post-content table,
    body .single-content table,
    body .article-content table {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    body pre {
        max-width: 100% !important;
        overflow-x: auto !important;
        white-space: pre-wrap !important;
    }
}
