.BEC-bg-bronze {
    height: 100%;
    width: 100%;
    background: rgb(255,255,222);
    background: radial-gradient(circle, rgb(255, 244, 239) 0%, rgb(255, 181, 142) 36%, rgb(187, 102, 67) 76%, rgb(159, 51, 0) 100%);
}

.BEC-bg-title-bronze {
    background-color: rgb(159, 51, 0);
}

.BEC-bg-silver {
    height: 100%;
    width: 100%;
    background: rgb(255,255,222);
    background: radial-gradient(circle, rgb(255, 255, 255) 0%, rgb(222, 222, 222) 36%, rgb(141, 141, 141) 76%, rgb(108, 108, 108) 100%);
}

.BEC-bg-title-silver {
    background-color: rgb(108, 108, 108);
}

.BEC-bg-gold {
    height: 100%;
    width: 100%;
    background: rgb(255,255,222);
    background: radial-gradient(circle, rgb(255, 255, 255) 0%, rgb(247, 250, 127) 36%, rgba(255,206,97,1) 76%, rgba(255,166,10,1) 100%);
}

.BEC-bg-title-gold {
    background-color: rgb(227, 144, 0);
}

.BEC-color-bronze {
    color: rgb(159, 51, 0);
}

.BEC-color-silver {
    color: rgb(97, 97, 97);
}

.BEC-color-gold {
    color: rgb(207, 133, 3)
}

.BEC-bg-color-lightbronze {
    background-color: rgb(255, 207, 183);
}

.BEC-bg-color-lightsilver {
    background-color: rgb(232, 232, 232);
}

.BEC-bg-color-lightgold {
    background-color: rgb(255, 248, 197)
}

.BEC-achievement-dot {
    height: 10px;
    width: 10px;
    border-radius: 50%;
    display: inline-block;
}

.BEC-center {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.BEC-center2 {
    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
}
.contentbody {
    /*    background-color: white;
    flex-grow: 1;
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;*/

    align-content: center;
     height: calc(100vh - 56px);
    max-height: calc(100vh - 56px);
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    container-type: inline-size;
    container-name: contentregion;
}

@media (max-width:640px) {
    .contentbody {
        max-height: calc(100vh - 56px - 56px);
        overflow: hidden;
    }
}