.dice {  
    padding: 4px;  
    background-color: greenyellow;  
    width: 150px;  
    height: 150px;  
    border-radius: 10%;
    margin: 1%;
    box-shadow: 3px 3px rgb(12, 12, 12), -1em 0 .4em olive;
}

.dot {
    display: block;
       width: 36px;
       height: 36px;
       border-radius: 50%;
       background-color:white;
    }
.first-face {
    display: flex;
    justify-content: center;
    align-items: center;
    }
.second-face{
    display: flex;           
    justify-content : space-between;
            }
.second-face .dot:nth-of-type(2) {
    align-self: flex-end;
            }
.third-face {
    display: flex;
    justify-content: space-between;
            }
              
.third-face .dot:nth-of-type(1) {
    align-self :flex-end;
            }
              
.third-face .dot:nth-of-type(2) {
    align-self :center;
            }
              
              
.fourth-face , .sixth-face, .fifth-face{
    display: flex;
    justify-content: space-between;
            }
              
.fourth-face .column , .sixth-face .column, .fifth-face .column{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
            }
              
.fifth-face .column:nth-of-type(2) {
    justify-content: center;
            }
footer{
    text-align: center;
    padding: 1%;
    background-color: #EAEDED;
}
h5{
    color: #000;
}
.far fa-envelope{
    color: #000;
}