/*       
    article section:first-child
    {
    }
    */


            .article-opening
            {
                xletter-spacing: -1px;
            }


            /*  Should this be a HX heading? */
            h3,
            .article-opening-big
            {   
                word-spacing: 0.05em;
                line-height: 1.25;
                font-size: var(--var-font-size-h3, 10px);
                margin-bottom: var(--var-font-m-b-article-opening-big, 1.5em);                
            }

            h4,
            .article-opening-small
            {   
                margin-bottom: var(--var-font-m-b-article-opening-small, 1.5em); /* this should come from h4 */
            }

            /*
                Think this can be removed
            */
            /*
            .article-opening-br-extra,
            .br-extra
            {
                font-size: 55%;
                display: block;
                background-color: red;
                border: 1px solid red;
            }
            */

            @media screen and (max-width: 575px) {

                h3, .article-opening-big,
                h4, .article-opening-small                 
                {
                    font-family: "Poppins-700";
                    letter-spacing: -1px;
                    word-spacing: 2px;
                }
                   
            }


        /*
        //
        //  Another wee hack
        //  The idea is that BRs are hidden on xs screen sizes.
        //
        */

        .article-opening br {
            display: none;
        }

        @media (min-width: 576px) {

            .article-opening br {
                display: inline-block;
            }
            
        }            

        /*
        *  
        *  Another wee hack, works without CSS at all
        *  
        */


        @media (min-width: 576px) {

            h3 i,
            h4 i
            {
                display: block;
                content: "\A";
                white-space: pre;
            }
            
            
        }