body,html{margin:0;padding:0;height:100%;}
body{background:#f5f4ef;box-shadow: inset 0 0 20vmin 0 #006400;}
#radial-menu-wrap {
    position:absolute;
    height:80vmin; width:80vmin;
    top:50%;left:50%;
    transform:translate(-50%, -50%);
}
#radial-menu-wrap .menuBtn {
    position:absolute;
    top:50%;
    left:50%;
    width:10vmin; height:10vmin;
    border-radius:100%;
    background:#006400;
    transform:translate3d(-50%, -50%, 0);
}
#radial-menu-wrap .menuBtn span {
    position:absolute;
    width:60%;height:4px;
    background:white;
    left:20%; top:50%;
    border-radius:0;
}
#radial-menu-wrap .menuBtn span::after,
#radial-menu-wrap .menuBtn span::before {
    content:'';
    position:absolute;
    left:0; top:-1.5vmin;
    width:100%; height:100%;
    background:inherit;
}
#radial-menu-wrap .menuBtn span:after {
    top:1.5vmin;
}

#radial-menu {
    position:absolute;
    height:100%; width:100%;
    top:0;left:0;
    transform: scale(.8);
    opacity:0;
    transition:transform .8s, opacity .6s;
    pointer-events:none;
}
#radial-menu circle:hover {
    cursor:pointer;
}
#radial-menu .centerLink {
    fill:#ccffcc;
    fill-opacity:1.1;
    transition: fill-opacity .2s;
}
#radial-menu .centerLink:hover {
    fill-opacity:0;
}
#radial-menu .centerLink.textDisplayed {
    fill-opacity:0.8;
}
#radial-menu .outerLink {
    stroke:#000;
    stroke-opacity:0.5;
    transition: stroke-opacity .2s;
}
#radial-menu .outerLink:hover {
    stroke-opacity:0;
}
#radial-menu.openRadialMenu {
    pointer-events: initial;
    opacity:1;
    transform: scale(1);
}
#radial-menu .centerImage,
#radial-menu .outerImage {pointer-events:none;}

#radial-menu .centerText {
    margin:10%;
    width:80%;height:80%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    line-height:1em;
    color:#fff;
}
#radial-menu .centerText * {margin:.2em 0;}
#radial-menu .displayText {
    opacity:1;
}
#radial-menu [class^="centerText"] {
    pointer-events:none;
}