body.custom-background { 
    background-color: #e7e7d1; 
}

/* 1. Hovedbeholderen centreres */
#page {
    max-width: 1080px !important;
    width: 95% !important;
    margin: 0 auto !important;
}

/* 2. Headeren fylder hele bredden øverst */
#masthead {
    width: 100% !important;
    float: none !important;
    clear: both !important;
    margin-bottom: 30px !important;
}

/* 3. #main sættes til Flexbox og ophæver temaets gamle clearing/floats */
#main.wrapper {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#main.wrapper::before,
#main.wrapper::after {
    display: none !important; /* Fjerner temaets mærkelige clearfix som kan forstyrre flex */
}

/* 4. Venstre/midterste del: Indhold ("Om mig") */
#primary {
    order: 1 !important; /* Tvinges til at stå først (venstre) */
    width: calc(100% - 320px) !important; /* Tager resten af pladsen udover sidebjælken */
    float: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* 5. Højre del: Sidebjælken (Søgefelt + Rejseblogs) */
#secondary {
    order: 2 !important; /* Tvinges til at stå sidst (højre) */
    width: 280px !important; /* Fast bredde på sidebjælken */
    float: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* Billeder tilpasses altid deres felt */
.entry-content img {
    max-width: 100%;
    height: auto;
}

/* Mobil-visning: Stabel sidebjælken under indholdet på små skærme */
@media (max-width: 800px) {
    #main.wrapper {
        flex-direction: column !important;
    }
    #primary, 
    #secondary {
        width: 100% !important;
    }
    #secondary {
        margin-top: 40px !important;
    }
}