.strapline, #topnavdesktop {
    position: relative

}

.top-sleigh {
    max-width: 90%;
    max-height: 30px;
    margin: auto
}

.teltop > i {
    -moz-transform: scale(-1, 1);
    -webkit-transform: scale(-1, 1);
    -o-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1);
}

.hdrdivmobile >.row::before {
    content: "";
    position: absolute;
    top: 55px; /* shift upward */
    left: 0px; /* shift left */
    width: 100%;
    height: 25px;
    background-image: url('/images/fairylights2.png');
    background-repeat: repeat-x;
    background-position: center;
    z-index: 1; /* keep behind the content */
    pointer-events: none;
}

@media (max-width: 699px) {
    .top-sleigh {
        max-width: 90%;
        max-height: 30px;
        margin: auto
    }
    .strapline {
        min-height: 125px;
        margin: auto;
        padding-left:100px!important;padding-right:100px!important
    }

        .strapline::after {
            content: "";
            position: absolute;
            top: -20px; /* shift upward */
            left: 0px; /* shift left */
            width: 100%;
            height: 180px;
            background-image: url('/images/snowline2.png'),url('/images/snowman.png'),url('/images/tree-silhouette2.png');
            background-repeat: repeat-x, no-repeat,no-repeat;
            background-position: center bottom, 115%,-15%;
            background-size:unset,10%,1000px;
            z-index: 1; /* keep behind the content */
            pointer-events: none;
        }
}


    @media (min-width: 700px) {
        .top-sleigh {
            max-width: 90%;
            max-height: 30px;
            margin: auto
        }
        .strapline {
            min-height: 85px;
            margin: auto
        }

            .strapline::after {
                content: "";
                position: absolute;
                top: -105px; /* shift upward */
                left: 0px; /* shift left */
                width: 100%;
                height: 200px;
                background-image: url('/images/snowline2.png'),url('/images/snowman.png'),url('/images/tree-silhouette2.png');
                background-repeat: repeat-x, no-repeat,no-repeat;
                background-position: center bottom, right,left;
                z-index: 1; /* keep behind the content */
                pointer-events: none;
            }
    }

    @media (min-width: 900px) {
        .top-sleigh {
            max-width: 90%;
            max-height: 40px;
            margin: auto
        }
        .strapline {
            min-height: 85px;
            margin: auto
        }

            .strapline::after {
                content: "";
                position: absolute;
                top: -155px; /* shift upward */
                left: 0px; /* shift left */
                width: 100%;
                height: 250px;
                background-image: url('/images/snowline2.png'),url('/images/snowman2.png'),url('/images/tree-silhouette3.png');
                background-repeat: repeat-x, no-repeat,no-repeat;
                background-position: center bottom, right,left;
                z-index: 1; /* keep behind the content */
                pointer-events: none;
            }
    }

@media (min-width: 1000px) {
    .top-sleigh {
        max-width: 90%;
        max-height: 80px;
        margin: auto
    }
}

    .straplineold::after {
        content: "";
        position: absolute;
        top: -10px; /* shift upward */
        left: 0px; /* shift left */
        width: 100%;
        height: 20px;
        background-image: url('/images/snowline2.png');
        background-repeat: repeat-x;
        background-position: center;
        z-index: 1; /* keep behind the content */
        pointer-events: none;
    }


    #topnavdesktop::after {
        content: "";
        position: absolute;
        bottom: -20px; /* shift upward */
        left: 0px; /* shift left */
        width: 100%;
        height: 25px;
        background-image: url('/images/fairylights2.png');
        background-repeat: repeat-x;
        background-position: center;
        z-index: 1000; /* keep behind the content */
        pointer-events: none;
    }

    .snowcontainer {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0px;
        left: 0px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        z-index: 2000;
        pointer-events: none;
    }

    .snowflake {
        position: absolute;
        color: white;
        pointer-events: none;
        text-shadow: 0 0 3px rgba(255,255,255,0.8);
        animation: fall linear forwards;
        z-index: 10000;
    }

    @keyframes fall {
        to {
            transform: translateY(700px) rotate(360deg);
        }
    }