@charset 'UTF-8';

/*******************************************************************************/
/*******************************************************************************/
/*******************************************************************************/

/* 
    Note:   When new colors have been added, you can directly copy 
            paste into the ~/libraries/assets folder.
*/

/*******************************************************************************/
/*******************************************************************************/
/*******************************************************************************/

/* IMPORTED STYLES */

@import url("./styles.css");
@import url("./timer-counter.css");

/*******************************************************************************/
/*******************************************************************************/
/*******************************************************************************/

/* COLORS */
/* 
    PC = Main Color
    SC = Secondary Color
    HC = Highlight Color
    FC = Footer Color
    BC = Background Color
    
    FPC = Font Color on Main Color
    FSC = Font Color on Secondary Color
    FHC = Font Color on Highlight Color
    FFC = Font Color on Footer Color
    FBC = Font Color on Background Color
*/

:root {
    --MC: #0066CC;
    --FMC: #FFFFFF;

    --SC: #FFCE3A;
    --FSC: #0066CC;

    --HC: #8D2325;
    --FHC: #FFFFFF;

    --FC: #002955;
    --FFC: #FFFFFF;

    --BC: #FFFFFF;
    --FBC: #0066CC;
}

/*******************************************************************************/
/*******************************************************************************/
/*******************************************************************************/

/* PRELOADERS */

#vue_app {
    opacity: 0;
    transition: opacity .5s linear
}

#afs-preloader {
    pointer-events: none;
    display: block;
    box-sizing: border-box;
    width: 7rem;
    height: 7rem;
    border: .75rem solid #f8f8f8;
    border-top: .75rem solid #09f;
    border-radius: 50%;
    animation: spin 2s linear infinite;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99999999999999999999999999999;
    opacity: 1;
    transition: opacity .5s linear
}

@keyframes spin {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

/*******************************************************************************/
/*******************************************************************************/
/*******************************************************************************/

/* ADDITIONAL STYLES */

body {
    background: var(--BC);
    color: var(--FBC);
}

body > img {
    position: absolute;
}

.psgTimer_labels>div,
.ascendfs-count-down .label {
    color: var(--FBC)
}

.ascendfs-count-down .count {
    background: var(--SC);
    color: var(--FSC) !important;
    text-shadow: none !important
}

/*******************************************************************************/
/*******************************************************************************/
/*******************************************************************************/

/* CUSTOM STYLES */

/*******************************************************************************/
/*******************************************************************************/
/*******************************************************************************/