:root {
    /***************************************
     * Colors (managed in atomic config, enable here to override)
     ****************************************/
    /*--bcnb-color-bg:#fff; !* content background *!*/
    /*--bcnb-color-text:#1c1c1c; !* body text *!*/
    /*--bcnb-color-heading:var(--bcnb-color-primary);*/


    /***************************************
    * Miscellaneous
    ****************************************/
    /* these variables will be updated by updateCSSVariables() */
    --bcnb-scroll-bar-width:8px;
    --bcnb-address-bar-height:0px;
    --bcnb-100vw:calc(100vw - var(--bcnb-scroll-bar-width));
    --bcnb-100vh:calc(100vh - var(--bcnb-address-bar-height));

    /* Transition */
    --bcnb-transition:all .3s ease;
    --bcnb-transition-slow:all .6s ease;

    /* decoration */
    --ruler-shape:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA3MC45NCAzMC40OCI+CiAgPGRlZnM+CiAgICA8c3R5bGU+CiAgICAgIC5jbHMtMSB7CiAgICAgICAgZmlsbDogI2ZmZjsKICAgICAgfQoKICAgICAgLmNscy0yIHsKICAgICAgICBvcGFjaXR5OiAuNzsKICAgICAgfQoKICAgICAgLmNscy0yLCAuY2xzLTMsIC5jbHMtNCB7CiAgICAgICAgaXNvbGF0aW9uOiBpc29sYXRlOwogICAgICB9CgogICAgICAuY2xzLTMgewogICAgICAgIG9wYWNpdHk6IC4zOwogICAgICB9CgogICAgICAuY2xzLTQgewogICAgICAgIG9wYWNpdHk6IDA7CiAgICAgIH0KICAgIDwvc3R5bGU+CiAgPC9kZWZzPgogIDxnIGNsYXNzPSJjbHMtMiI+CiAgICA8cmVjdCBjbGFzcz0iY2xzLTEiIHdpZHRoPSIuNzUiIGhlaWdodD0iMzAuNDgiLz4KICA8L2c+CiAgPGcgY2xhc3M9ImNscy0zIj4KICAgIDxyZWN0IGNsYXNzPSJjbHMtMSIgeD0iNy44IiB5PSIxNi45OCIgd2lkdGg9Ii43NSIgaGVpZ2h0PSIxMy41Ii8+CiAgPC9nPgogIDxnIGNsYXNzPSJjbHMtMyI+CiAgICA8cmVjdCBjbGFzcz0iY2xzLTEiIHg9IjE1LjYiIHk9IjE2Ljk4IiB3aWR0aD0iLjc1IiBoZWlnaHQ9IjEzLjUiLz4KICA8L2c+CiAgPGcgY2xhc3M9ImNscy0zIj4KICAgIDxyZWN0IGNsYXNzPSJjbHMtMSIgeD0iMjMuNCIgeT0iMTYuOTgiIHdpZHRoPSIuNzUiIGhlaWdodD0iMTMuNSIvPgogIDwvZz4KICA8ZyBjbGFzcz0iY2xzLTMiPgogICAgPHJlY3QgY2xhc3M9ImNscy0xIiB4PSIzMS4xOSIgeT0iMTYuOTgiIHdpZHRoPSIuNzUiIGhlaWdodD0iMTMuNSIvPgogIDwvZz4KICA8ZyBjbGFzcz0iY2xzLTMiPgogICAgPHJlY3QgY2xhc3M9ImNscy0xIiB4PSIzOC45OSIgeT0iMTYuOTgiIHdpZHRoPSIuNzUiIGhlaWdodD0iMTMuNSIvPgogIDwvZz4KICA8ZyBjbGFzcz0iY2xzLTMiPgogICAgPHJlY3QgY2xhc3M9ImNscy0xIiB4PSI0Ni43OSIgeT0iMTYuOTgiIHdpZHRoPSIuNzUiIGhlaWdodD0iMTMuNSIvPgogIDwvZz4KICA8ZyBjbGFzcz0iY2xzLTMiPgogICAgPHJlY3QgY2xhc3M9ImNscy0xIiB4PSI1NC41OSIgeT0iMTYuOTgiIHdpZHRoPSIuNzUiIGhlaWdodD0iMTMuNSIvPgogIDwvZz4KICA8ZyBjbGFzcz0iY2xzLTMiPgogICAgPHJlY3QgY2xhc3M9ImNscy0xIiB4PSI2Mi4zOSIgeT0iMTYuOTgiIHdpZHRoPSIuNzUiIGhlaWdodD0iMTMuNSIvPgogIDwvZz4KICA8ZyBjbGFzcz0iY2xzLTQiPgogICAgPHJlY3QgY2xhc3M9ImNscy0xIiB4PSI3MC4xOSIgd2lkdGg9Ii43NSIgaGVpZ2h0PSIzMC40OCIvPgogIDwvZz4KPC9zdmc+);
    --grid-pattern:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA0MCA0MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzUwMDRfMTUzMzMpIj4KPGxpbmUgeDE9IjM5LjUiIHkxPSItMi4xODU1N2UtMDgiIHgyPSIzOS41IiB5Mj0iNDAiIHN0cm9rZT0id2hpdGUiLz4KPGxpbmUgeDE9IjAuNSIgeTE9Ii0yLjE4NTU3ZS0wOCIgeDI9IjAuNTAwMDAyIiB5Mj0iNDAiIHN0cm9rZT0id2hpdGUiLz4KPGxpbmUgeDE9IjM5LjM1MzYiIHkxPSItMjkuNjQ2NCIgeDI9Ii03LjY0NjQ1IiB5Mj0iMTcuMzUzNiIgc3Ryb2tlPSJ3aGl0ZSIvPgo8bGluZSB4MT0iMzkuMzUzNiIgeTE9Ii0xOS42NDY0IiB4Mj0iLTcuNjQ2NDUiIHkyPSIyNy4zNTM2IiBzdHJva2U9IndoaXRlIi8+CjxsaW5lIHgxPSIzOS4zNTM2IiB5MT0iLTkuNjQ2NDUiIHgyPSItNy42NDY0NSIgeTI9IjM3LjM1MzYiIHN0cm9rZT0id2hpdGUiLz4KPGxpbmUgeDE9IjM5LjM1MzYiIHkxPSIwLjM1MzU1MyIgeDI9Ii03LjY0NjQ1IiB5Mj0iNDcuMzUzNiIgc3Ryb2tlPSJ3aGl0ZSIvPgo8bGluZSB4MT0iMzkuMzUzNiIgeTE9IjEwLjM1MzYiIHgyPSItNy42NDY0NSIgeTI9IjU3LjM1MzYiIHN0cm9rZT0id2hpdGUiLz4KPGxpbmUgeDE9IjM5LjM1MzYiIHkxPSIyMC4zNTM2IiB4Mj0iLTcuNjQ2NDUiIHkyPSI2Ny4zNTM2IiBzdHJva2U9IndoaXRlIi8+CjxsaW5lIHgxPSIzOS4zNTM2IiB5MT0iMzAuMzUzNiIgeDI9Ii03LjY0NjQ1IiB5Mj0iNzcuMzUzNiIgc3Ryb2tlPSJ3aGl0ZSIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzUwMDRfMTUzMzMiPgo8cmVjdCB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIGZpbGw9IndoaXRlIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg==);
}


@media only screen and (min-width:1180px) {
    :root {
        --bcnb-size-h1:80px;
    }
}
@media only screen and (max-width:480px) {
    :root {
        --bcnb-size-82:40px;
    }
}