.containerBG {
    display: block;
    justify-content: center;
}

.defaultBG {
    height: 100%;
    width: 100%;
    display: block;
    object-fit: cover;
    position: absolute;
	background-color: black;
}

.defaultLogo {
    content: url(../common/preload/logo/logo.gif);
    width: min(590px, 65%);
    height: min(290px, 50%);
    object-fit: contain;
    transform: translateY(-15%);
}

.bgBlurWF {
    content: url(../common/preload/custom/WfGaming/wfgaming_blur_bg.jpg?v=1);
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.bgMainWF {
    content: url(../common/preload/custom/WfGaming/wfgaming_bg_bright.jpg?v=2);
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.containerWF {
    display: flex;
    height: 100%;
    justify-content: space-evenly;
    flex-flow: column;

    * {
        background-size: contain; /* Ensures the image fits within the div */
        background-repeat: no-repeat;
        background-position: center;
    }
}

.logoWF {
    background-image: url(../common/preload/custom/WfGaming/wfgaming_logo.png?v=2);
    height: min(30%, 313px);
    aspect-ratio: 313 / 313;
    animation: idle 1s linear infinite;
}

.iconLoadingWF {
    background-image: url(../common/preload/custom/WfGaming/icon_loading.png?v=1);
    height: min(20%, 169px);
    aspect-ratio: 171 / 169;
    /** animation **/
    animation: spin 1s linear infinite;
}

.partnerEpicWin {
    background-image: url(../common/preload/custom/WfGaming/epicwin_partner.png?v=1);
    height: min(15%, 202px);
    aspect-ratio: 175 / 202;
    animation: idle 1s linear infinite;
}

@media (max-aspect-ratio: 576/1248) {
    .bgMainWF {
        /** make the content to fill the screensize when the width is too narrow **/
        object-fit: fill;
    }
}

@keyframes idle {
    100% {
        transform: none;
    }
}