@font-face {
    font-family: jBM;
    src: url(../font/jetBrainsMono.ttf);
    font-size: 20px;
    font-style: bold;
    font-weight: bold;
}

@font-face {
    font-family: ps;
    src: url(../font/productSans.ttf);
    font-size: 20px;
    font-style: normal;
    font-weight: normal;
}

@font-face {
    font-family: ps_b;
    src: url(../font/productSans_bold.ttf);
    font-size: 20px;
    font-style: bold;
    font-weight: bold;
}

@font-face {
    font-family: ps_l;
    src: url(../font/productSans_light.ttf);
    font-size: 20px;
    font-style: light;
    font-weight: light;
}

* {    
    --c1: #fff ;            
    --c2: #000;    
    --c3: #888;
    margin: 0px;
    padding: 0px;
    border: 0px;      
    font-family: jBM; 
    /* overflow-x: hidden;  
    overflow-y: 1rem; */
}

body {
    background-color: var(--c2);       
}

p {
    color: var(--c1);
    font-size: 3rem;  
    overflow-wrap: break-word;
    word-break: break-word;
    overflow-wrap: break-word; 
    word-wrap: break-word;
}
 
/* .background-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../img/bg.svg);
    background-repeat: repeat-y;
    background-size: 50%;
    background-position: center;
    opacity: 0.2;
    z-index: -1;
    pointer-events: none;
} */

.content { 
    position: relative;
    z-index: 1;
    padding: 1rem;
}