.ylapalkki {
    background-color: #2d5054;
    /*yläpalkin taustaväri*/
}

.ylapalkki-sisalto {
    max-width: 1200px;
    /*yläpalkin maksimileveys*/
    margin: 0 auto;
    /*yläpalkin marginaalit ylä/ala=0px ja vasen/oikea reuna=automaattinen(palkki tulee keskelle).*/
}

/*yläpalkin tekstiasetukset*/
.ylapalkki a {
    color: white;
    text-decoration: none;
    font-family: Georgia, serif;
    font-size: 1rem;
}

.ylapalkki a:hover {
    text-decoration: underline;
    /*teksti alleviivataan, kun hiiri on linkin päällä.*/
}

.valikko {
    display: flex;
    /*tällä linkit saadaan vierekkäin, ei allekkain.*/
    justify-content: center;
    /*tällä linkit saadaan keskelle yläpalkkia.*/
    gap: 50px;
    /*tämä määrittelee kuinka paljon tyhjää tilaa linkkien välissä on.*/

    padding: 10px 20px;
    /*linkkielementtien sisäpuolella oleva tyhjä tila (ylä/ala=10px ja vasen/oikea=20px).*/
}

.etusivu-linkki {
    display: none;
}


/* mobiilinäkymän tyyliasetukset */
@media (max-width: 768px) {

    .valikko {
        display: none;
    }

    .ylapalkki-sisalto {
        padding: 12px 20px;
        text-align: left;
    }

    .etusivu-linkki {
        display: inline-block;
        font-size: 1.1rem;
    }
}