.circle{
    border-radius: 50%;
}
#supercellLogo{
    background-color: #2f2f2f;
    width: 121px;
    height: 121px;
    padding: 40px;
    display: flex;
    align-items: center;
    position:relative;left:50%;transform: translateX(-50%);
}
header{
    background-image: url('../images/bg.jpg');
    background-size: cover;
}
section#urheber, section#weitereSpiele{
    height:100vh;
    display:flex;
    flex-direction: column;
    justify-content: center;
}
section#urheber{
    height:60vh;
}
section#weitereSpiele .content{
    display:flex;
    flex-direction: row;
    justify-content: space-evenly;
}
#weitereSpiele .content .circle{
    --size: 10vw;
    height:var(--size);
    width: var(--size);
    max-height:8em;
    max-width:8em;
    background-color:cadetblue;
    background-repeat: no-repeat;
    background-size: 90%;
    background-position: center;
}
#weitereSpiele .boombeach{
    background: url('../images/boombeachlogo.png');
}
#weitereSpiele .clashroyale{
    background-image: url('../images/clashroyalelogo.png');
    background-size:152% !important;
}
#weitereSpiele .hayday{
    background-image: url('../images/haydaylogo.png');
}
#weitereSpiele .brawlstars{
    background-image: url('../images/brawlstarslogo.png');
}

@media screen and (max-width:600px) {
    section#weitereSpiele .content{
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
        /*Adjust height to add space between elements*/
        height:480px;
    }
    #weitereSpiele .content .circle{
        --size:28vw;
    }
}