/* Perusasetukset */
body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: Arial, sans-serif;
    /* Käytetään flexboxia asettelemaan header ja alaosa allekkain */
    display: flex;
    flex-direction: column;
}

/* KEHYS 2: BANNERI (11%) */
#banneri_2 {
    /* Määritellään korkeus tarkasti vanhan framesetin mukaisesti */
    height: 11%;
    width: 100%;
}

/* Bannerin ja kaikkien muidenkin iframejen sisäinen asettelu */
#banneri_2 iframe, #alaosa_container iframe {
    width: 100%;
    height: 100%;
}

/* KEHYKSET 1 ja 3: ALAOSA (LOPUT TILASTA) */
#alaosa_container {
    /* Täyttää kaiken jäljellä olevan pystysuoran tilan */
    flex-grow: 1;
    width: 100%;
    /* Käytetään flexboxia asettelemaan Vasen Ohjaus ja Pääsisältö vierekkäin */
    display: flex;
}

/* KEHYS 1: VASEN OHJAUS (15%) */
#vasen_ohjaus_1 {
    /* Määritellään leveys tarkasti vanhan framesetin mukaisesti */
    width: 15%;
    height: 100%;
    /* Voit lisätä tähän rajat, esim. border-right: 4px solid blue; vastaamaan framesetin border-asetuksia */
}

/* KEHYS 3: PÄÄSISÄLTÖ (LOPUT TILASTA) */
#paasisalto_3 {
    /* Täyttää kaiken vaakasuoran tilan 15% jälkeen */
    flex-grow: 1;
    height: 100%;
}