body {
}
.centeredIcons {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}


.thermomenterIcons {
    width: 60px;
    height: 60px;
    mask-size: cover;
    -webkit-mask-size: cover;
    background-color: currentColor;
       cursor: pointer;
    transition: color 0.2s, transform 0.2s;
}

    .thermometerColor8 {
        mask-image: url('../static/icons/icon8.svg');
        -webkit-mask-image: url('../static/icons/icon8.svg');
        background-color: #4B9CD3;
    }

    .thermometerColor7 {
        mask-image: url('../static/icons/icon7.svg');
        -webkit-mask-image: url('../static/icons/icon7.svg');
        background-color: #7BAFD4;
    }

    .thermometerColor6 {
        mask-image: url('../static/icons/icon6.svg');
        -webkit-mask-image: url('../static/icons/icon6.svg');
        background-color: #00A877;
    }

    .thermometerColor5 {
        mask-image: url('../static/icons/icon5.svg');
        -webkit-mask-image: url('../static/icons/icon5.svg');
        background-color: #7FBA77;
    }

    .thermometerColor4 {
        mask-image: url('../static/icons/icon4.svg');
        -webkit-mask-image: url('../static/icons/icon4.svg');
        background-color: #F4C300;
    }

    .thermometerColor3 {
        mask-image: url('../static/icons/icon3.svg');
        -webkit-mask-image: url('../static/icons/icon3.svg');
        background-color: #F7D358;
    }

    .thermometerColor2 {
        mask-image: url('../static/icons/icon2.svg');
        -webkit-mask-image: url('../static/icons/icon2.svg');
        background-color: #F67828;
    }

    .thermometerColor1 {
        mask-image: url('../static/icons/icon1.svg');
        -webkit-mask-image: url('../static/icons/icon1.svg');
        background-color: #D32D2D;
    }