:root {
    --x: 50vw;
    --y: 50vh;
    background: radial-gradient(circle at var(--x) var(--y) in oklab, #000, #222 33%);
}

.TopBar {
    background: radial-gradient(circle at var(--x) var(--y) in oklab, #000, #093519 33%);
}

#StartButtons {
    position: absolute;

    left: 50%;
    top: calc(3/4*100%);
    transform: translate(-50%, -50%);

    height: 50px;
}

.StartButton {
    height: 50px;

    padding-left: calc((50px - 35px)/2);
    padding-right: calc((50px - 35px)/2);

    outline-width: 5px;

    font-size: 35px;

    border-radius: 7px;
}

.StartButton:hover {
    outline-width: 8px;
}

#StartText {
    position: absolute;

    left: 50%;
    top: calc(1/3*100%);
    transform: translate(-50%, -50%);
    font-size: 50px;

    color: #555;
}

#StartDiv {
    position: relative;
    height: calc(100% - 200px);
}

.TopBar {
    height: 200px;

    transition: height 0.5s ease
}

.LogoImage {
    left: 50%;

    transform: translate(-50%, -50%);

    transition: left 0.5s ease, transform 0.5s ease;
}

#TopBarOppose {
    height: 0px;

    transition: height 0.5s ease
}