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

.preloadBg {
    content: url();
    height: 100%;
    width: 100%;
    object-fit: 100%;
    position: fixed;
}

.iconReload {
    content: url(../common/preload/icon_reload.png);
    height: 10%;
    width: auto;
    position: absolute;
    object-fit: cover;
    display: block;
    top: 95%;
    left: 5%;
    transform: translate(0%, -100%);
}

.potraitBlocker {
    content: url(../common/generic/potraitBlocker.jpg);
    height: 100%;
    width: 100%;
    display: block;
    object-fit: cover;
    position: absolute;
}

.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%);
}

@-moz-keyframes spin {
    100% {
        -moz-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.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;
    }
}