div#eightball{
  height: 500px;
  width: 500px;
  background-image: radial-gradient(circle at center, #000000FF 31%, #ffffff 32%, #000000EE 36%, #777777 1%, black 68%, #ffffff33 70%, #ffffff00 71%);
  border-radius: 50%;
  display: inline-block;
}

div#eightball-dice {
    border-color: blue;
    transform: rotate(0deg);
    position: relative;
    top: 30%;
    width: 100%;
    text-align: center;
}

#message-container{
    height: 88px;
}

#eightball-message {
    font-family: Arial;
    padding: 5px 40px 5px 40px;
    font-size: 0.65em;
    color: white;
    text-transform: uppercase;
    text-align: center;
    hyphens: auto;
}

.left, .right {
  height: 105px;
  width: 40%;
}

.left {
    clip-path: polygon(40% 0%, 110% 100%, 40% 100%);
    float: left;
    shape-outside: polygon(40% 0%, 110% 100%, 40% 100%);
}

.right {
    clip-path: polygon(90% -50%, 100% 100%, -10% 100%);
    float: right;
    shape-outside: polygon(90% -50%, 100% 100%, -10% 100%);
}