body {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    margin: 0;

    background-color: #eee;
}

p {
    margin: 0;
    padding: 0;
}

#main {
    width: 750px;

    background: white;
}

#chart {
    position: relative;
}

#chart path {
    stroke: #fff;
}

#explanation {
    position: absolute;
    text-align: center;
    color: #666;
    z-index: 1;
}

#percentage {
    font-size: 2.5em;
}

#icon {
    font-size: 5em;
}

#iconSmall {
    margin-top: 52px;
    font-size: 3em;
}

#explanation .popup {
    position: absolute;
    z-index: 9;
    opacity: 0;
    background: white;
    border: solid 1px black;
    border-radius: 5px;
    width: 80%;
    left: 10%;
    pointer-events: none;
    transition: opacity .4s ease;
}
#explanation .popup > div:nth-child(n + 2) {
    border-top: solid black 1px;
    padding: 10px 0 0;
}
#explanation .popup > div {
    margin: 10px 10px;
    pointer-events: none;
}