body {
    background: radial-gradient(circle, rgb(106, 231, 57), rgb(229, 255, 0), rgb(252, 176, 36), rgb(255, 0, 0), rgb(119, 2, 113));
}

head{
    text-align: center;
    background: radial-gradient(circle, rgb(106, 231, 57), rgb(229, 255, 0), rgb(252, 176, 36), rgb(255, 0, 0), rgb(119, 2, 113));
}

.box {
    display: inline-block;
    margin: 10px;
    width: 125px;
    height: 125px;
    background-color: rgb(0, 0, 0);
    border: 2px solid black;
}
.box:hover {
    background-color: blue;
    cursor: pointer;
}

.boxo {
    display: inline-block;
    margin: 10px;
    width: 125px;
    height: 125px;
    background-color: rgb(0, 0, 0);
    border: 2px solid black;
}
.boxo:hover {
    background-color: rgb(21, 255, 0);
    cursor: pointer;
}

.boxn {
    display: inline-block;
    margin: 10px;
    width: 125px;
    height: 125px;
    background-color: rgb(0, 0, 0);
    border: 2px solid black;
}
.boxn:hover {
    background-color: rgb(0, 225, 255);
    cursor: pointer;
}

.boxe {
    display: inline-block;
    margin: 10px;
    width: 125px;
    height: 125px;
    background-color: rgb(0, 0, 0);
    border: 2px solid black;
}
.boxe:hover {
    background-color: rgb(255, 0, 0);
    cursor: pointer;
}

.boxa {
    display: inline-block;
    margin: 10px;
    width: 125px;
    height: 125px;
    background-color: rgb(0, 0, 0);
    border: 2px solid black;
}
.boxa:hover {
    background-color: rgb(255, 251, 0);
    cursor: pointer;
}

.boxb{
    display: inline-block;
    margin: 10px;
    width: 125px;
    height: 125px;
    background-color: rgb(0, 0, 0);
    border: 2px solid black;
}
.boxb:hover {
    background-color: rgb(255, 0, 255);
    cursor: pointer;
}