#container
{
    position:           fixed;
    top:                0px;
    left:               0px;
    bottom:             0px;
    right:              0px;
    margin:             0px;
}

#donut
{
    position:           absolute;
    top:                50%;
    left:               50%;
    transform:          translate(-50%, -50%);
}

#axisDetails
{
    position:           absolute;
    top:                50%;
    right:              0%;
    transform:          translate(+0%, -50%);
    height:             100%; 
    background-color: rgb(64, 197, 93);
    padding:            10px 10px 20px 20px;
    overflow:           auto;
    font-size:          16px;
    text-align:         left;
}

#axisDetailsPicture
{
    display:            flex;
    max-width:          100%;
    margin:             auto;
    border-radius:      10%;
}

.hidden
{
    display:            none;
}

#axisDetailsMoreInfoLink{
    display: inline;
    color: black;
    text-decoration: none;
    background-color: white;
    border-radius: 4px;
    padding: 5px 5px 5px 5px;
    margin: 0 2px 0 2px;
    border: solid black 2px;
    font-weight: bold;
}

#axisDetailsMoreInfoLink:hover{
    transition: all 0.1s;
    margin: 0;
    border: solid black 4px;
}