body 
{
    font-family: Arial, sans-serif;
    background-color: #f0f4f8;
    padding: 15px 15px;
    background-repeat: no-repeat;
    background-position: bottom center;
    background-attachment: fixed; 
    background-size: contain; /* Of 'cover' als je het hele element wilt bedekken */
}

.watermark {
    position: fixed;
    top: 72%;
    left: 0;
    width: 100vw;                    
    display: flex;
    justify-content: space-around;    
    pointer-events: none;
    z-index: -1;
    transform: translateY(-50%) rotate(-90deg);
    margin-top:15px
}

.watermark div {
    writing-mode: vertical-rl;       
    font-size: clamp(4rem, 8vw, 10rem);
    font-weight: 700;
    color: rgba(0, 120, 0, 0.08);   
    line-height: 0.8;
    white-space: nowrap;
    letter-spacing: 4rem;            
}

/* Responsive voor mobiel */
@media (max-width: 768px) {
    .watermark {
        justify-content: space-between; 
        padding: 0 1rem;                
    }

    .watermark div {
        font-size: clamp(2rem, 12vw, 5rem); 
        letter-spacing: 0.5rem;        
        transform: scaleY(0.7);        
    }
}

h1, h2 {
    text-align: center;
    margin-bottom: 10px;
    font-size: 1.5em;
    color: #333333;
}

p{
    font-size:1.1em
}

/* BEGIN default horizontale lijn */
hr{
border:0;
height:1px;
margin-top:8px;
margin-bottom:6px;
margin-left:0;
width:100%;
background:linear-gradient(to left, rgba(204,204,204,9), transparent);
}

/* Standaard is de afbeelding zichtbaar op grotere schermen */
img[alt=telraam] {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 70%;
    height: auto;
    transform: translateX(-50%);
}

/* Verberg de afbeelding op schermen kleiner dan 768px */
@media (max-width: 768px) {
    img[alt=telraam] {
        display: none;
    }
}

/* VERBERG DE HELE PAGINA BIJ PRINT */
@media print {
    html, body {
        display: none !important;
        visibility: hidden !important;
    }

    * {
        display: none !important;
        visibility: hidden !important;
    }
}