html, body {
    background-color: rgb(13, 92, 92);
    font-size: 16px;
}

header {
    color: white;
    font-size: 50px;
    text-align: center;

}
.musicButton {
    background-color: rgb(248, 147, 164);
    position: fixed;
    top: 0px;

    width: 160px;
    height: 50px;
    border-radius: 4px;

    font-size: 1.1rem;
    font-weight: bolder;
    color: wheat;
    text-shadow: 2px 2px 2px black;
}

.middleArea {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

    height: 650px;

    border: 15px groove rgb(209, 143, 143);
    margin: 0px 20px;

    background-color: rgb(216, 170, 139);
}


.plantContainer {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    height: 600px;
    margin-right: 50px;

    text-align: center;
    
}

.canContainer {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    height: 600px;

    margin-left: 50px;
    position: relative;


}
.message {
    font-size: 2rem;
    color: rgb(182, 102, 48);
    font-weight: bolder;
}

.kasvi1{
    width: 600px;
    height: 600px;


}

#can {
    position: absolute;
    width: 400;
    height: 400px;
    bottom: 0px;

  
}