Print stylesheet

@media print {

    /* Hide stuff you don't want visible on the printed page */

    .foo {
        display: none;
    }

    /* Hiding video's and removing ugly whitespace fromr hidden iframes */

    .entry iframe, ins {
        display: none;
        width: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
        line-height: 0pt !important;
        white-space: nowrap;
    }

    .embed-youtube, .embed-responsive {
        position: absolute;
        height: 0;
        overflow: hidden;
    }

    /* Setting a page default for background and text */

    * {
        float: none;
    }

    *,
    *:before,
    *:after,
    *:first-letter,
    p:first-line,
    div:first-line,
    blockquote:first-line,
    li:first-line {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    body {
        color: #000;
        background: #fff;
        print-color-adjust: exact;
    }

    body, article {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    @page {
        margin: 2cm;
    }

    /* Prevent headers at the end of a page */

    h1, h2, h3 {
        page-break-after: avoid;
        page-break-inside:avoid
    }

    /* article will start on a fresh page */

    article {
        page-break-before: always;
    }

    /* Images */

    img {
        max-width: 100% !important;
    }

    a img {
        border: none;
    }

    /* Don't show linked images  */

    a[href$=".jpg"]:after, a[href$=".jpeg"]:after, a[href$=".gif"]:after, a[href$=".png"]:after { content: " (" attr(href) ") "; display:none;

    /* Preventing single lines on end of the page (Currently misses suport in Firefox) */

    p, h2, h3 {
        orphans: 3;
        widows: 3;
    }

    /* prevent large element to be split on multiple page */

    ul, ol, dl {
        page-break-inside: avoid;
        page-break-before:avoid;
    }

    img {
        page-break-inside:avoid;
        page-break-after:avoid;
    }

    a, pre {
        page-break-inside:avoid
    }

    /* Table */

    table { margin: 1px; text-align:left; }
    th { border-bottom: 1px solid #333;  font-weight: bold; }
    td { border-bottom: 1px solid #333; }
    th,td { padding: 4px 10px 4px 0; }
    tfoot { font-style: italic; }
    caption { background: #fff; margin-bottom:2em; text-align:left; }
    thead {display: table-header-group;}
    img,tr {page-break-inside: avoid;}

    /* Printing external links and supressing relative local links */

    article a {
        font-weight: bolder;
        text-decoration: none;
    }

    article a[href^=http]:after {
        content:" <" attr(href) "> ";
    }

    /* CSS4 easier way of preventing local links from expanding.. FOR THE FUTURES! */

    a:not(:local-link):after {
        content:" < " attr(href) "> ";
    }

    /* Don't show links that are fragment identifiers (anchor), or use the `javascript:` pseudo protocol */
    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    /* Links around images are rather more difficult, because CSS does not currently allow for the selection of an element based on its children.
       Ideally, links around images would have a class that we could target via CSS.
       Longer term, CSS4 features a parent selector that will do the job:
    */

    $a:after > img {
        content: "";
    }

    /* Printing abbreviations */

    abbr[title]:after {
        content: " (" attr(title) ")";
    }


    /* CSS filters (and svg for firefox) to invert the header images.

       CSS3 filters do what you’d expect — invert the colors in header images, turning black to white and vice versa — but they only work in Chrome and Safari.
       To cover Firefox, we need a different approach — the equivalent filter written as a separate SVG file:

        <svg xmlns="http://www.w3.org/2000/svg">
            <filter id="negative">
                <feColorMatrix values="-1 0 0 0 1
                0 -1 0 0 1
                0 0 -1 0 1
                0 0 0 1 0" />
            </filter>
        </svg>

    */

    header img {
        filter: url(inverse.svg#negative);
        -webkit-filter: invert(100%);
        filter: invert(100%);
    }



/* ONLY USE WHEN NEEDED */

    /* Print custom messages after the printed page, like copyright stuff */

    /* Adding custom messages before and after the content */

    /*
        .entry:after {
            content: "\ All Rights Reserved. (c) 2014 - 2016 TechBrain - techbrain.de";
            color: #999 !important;
            font-size: 1em;
            padding-top: 30px;
        }

        #header:before {
            content: "\ Thank you for printing our article. We hope that some of our other articles can catch your eye as well.";
            color: #777 !important;
            font-size: 1em;
            padding-top: 30px;
            text-align: center !important;
        }
    */

}

    /* Force webkit browsers to print background-images and colors */

    @media print and (color) {
    * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    }