#dice-roller-container, #dice-result-container, #extra-luck-container {
    background-color: #cccccc;
    border: 3px black solid;
    padding: 12px;
    text-align: center;
    margin-bottom: 24px;
    height: auto;
}
#binary-dice-roller {
    margin: auto;
    width: 95%;
    background-color: gray;
    border: 6px black double; 
    display: flex;
    flex-direction: row;
    align-items: center;
}
#extra-luck-container {
    display: flex;
    justify-content: space-around;
}
#luck-symbol {
    height: 72px;
    width: 72px;
    background-color: white;
}
#dice-roller-header h3 {
    font-size: 2.2em;
}
#dice-roller-container h4, #dice-result-container h4 {
    font-size: 1.5em;
    margin: 12px;
}
#binary-dice-roller h4 {
    display: inline-block;
    padding: 6px;
    border: 4px black double;
    font-size: 1em;
}
.binary-dice {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-color: white;
    box-shadow: 10px 10px red;
    clip-path: polygon(0% 0%, 25% 0%, 38% 3%, 58.5% 0%, 100% 0%, 100% 42.25%, 97.5% 70.47%, 100% 87.99%, 100% 100%, 78.46% 100%, 54% 100%, 27% 96%, 16% 100%, 0% 100%, 2.25% 79%, 0% 62.25%, 2.5% 28%, 0% 14.75%); 
    margin: 10px;
    padding: 12px;
    vertical-align: middle;
    text-align: center;
}
#dice-result-container {
    vertical-align: middle;
    margin-top: 24px;
    padding: 12px;
    display: flex;
    justify-content: center;
}
#dice-result-container div {
    margin: 12px;
}
#dice-result-container p, #dice-roller-container p {
    font-size: 1.5em;
}
#dice-result {
    display: inline-block;
    text-align: center;
    aspect-ratio: 1 / 1;
    width: 64px;
    padding: 24px;
    background-color: rgb(255, 255, 255);
    clip-path: polygon(0% 0%, 15.75% 0%, 29.25% 2.5%, 55.75% 0%, 61% 1.5%, 87% 0%, 100% 0%, 96.5% 27.5%, 100% 49.5%, 97.75% 69.75%, 100% 85.25%, 100% 100%, 87.25% 100%, 46% 97.25%, 13.5% 100%, 0% 100%, 0% 85.5%, 3.25% 70.5%, 0% 16.25%);
}
.binary-dice img, #dice-result img {
    height: 100%;
}
.binary-dice p {
    display: none;
}