@import "Hoster_Colors.css";
.POPT_WindowOff {
    display: none !important;
}

.POPT_WindowOut {
    position: fixed;
    z-index: 1;
    width: 800px !important;
    left: 1000px;
    opacity: 0.0;
    right: 0;
    top: 360px;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block;
    -webkit-animation: windowFadeOut 0.25s ease-out;
    -moz-animation: windowFadeOut 0.25s ease-out;
    -o-animation: windowFadeOut 0.25s ease-out;
    animation: windowFadeOut 0.25s ease-out;
}

    @-webkit-keyframes windowFadeOut {
        0% { display: block; opacity: 1; left: 0px }
        99% { display: block; opacity: 0; left: 500px }
        100% { display: none; opacity: 0; left: 500px }
    }

    @-moz-keyframes windowFadeOut {
        0% { display: block; opacity: 1; left: 0px }
        99% { display: block; opacity: 0; left: 500px }
        100% { display: none; opacity: 0; left: 500px }
    }

    @-o-keyframes windowFadeOut {
        0% { display: block; opacity: 1; left: 0px }
        99% { display: block; opacity: 0; left: 500px }
        100% { display: none; opacity: 0; left: 500px }
    }

    @keyframes windowFadeOut {
        0% { display: block; opacity: 1; left: 0px }
        99% { display: block; opacity: 0; left: 500px }
        100% { display: none; opacity: 0; left: 500px }
    }

    .POPT_WindowOn {
        border-color: rgba(28, 28, 124, 0.8);
        position: fixed;
        z-index: 1;
        width: 800px !important;
        left: 0px;
        opacity: 1.0;
        right: 0;
        top: 30px;
        margin-left: auto !important;
        margin-right: auto !important;
        display: block;
        font-family: Verdana;
        font-size: 14px;
        cursor: pointer;
        background-color: transparent;
        border-style: none;
        -webkit-animation: windowFadeIn 0.5s ease-out;
        -moz-animation: windowFadeIn 0.5s ease-out;
        -o-animation: windowFadeIn 0.5s ease-out;
        animation: windowFadeIn 0.5s ease-out;
    }

    .POPT_WindowOn tr {
    }


    .POPT_WindowFrame {
        width: 798px !important;
        overflow-x: hidden;
        overflow-y: scroll;
        background-color: var(--window-page-back-color);
    }

    @-webkit-keyframes windowFadeIn {
        0% { display: none; opacity: 0; left: -1000px }
        1% { display: block; opacity: 0; left: -1000px }
        100% { display: block; opacity: 1; left: 0px }
    }

    @-moz-keyframes windowFadeIn {
        0% { display: none; opacity: 0; left: -1000px }
        1% { display: block; opacity: 0; left: -1000px }
        100% { display: block; opacity: 1; left: 0px }
    }

    @-o-keyframes windowFadeIn {
        0% { display: none; opacity: 0; left: -1000px }
        1% { display: block; opacity: 0; left: -1000px }
        100% { display: block; opacity: 1; left: 0px }
    }

    @keyframes windowFadeIn {
        0% { display: none; opacity: 0; left: -1000px }
        1% { display: block; opacity: 0; left: -1000px }
        100% { display: block; opacity: 1; left: 0px }
    }

.POPT_Circle {
    border-radius: 40px;
    box-shadow: 2px 2px 12px #000000;
}

.POPT_Text {
    text-align: center;
    margin-top: 10px;
    font-family: Roboto;
    font-size: 16px;
    color: darkblue;
    background-color: #e0f0ff;
    border: 1px solid darkgray;
    border-radius: 6px;
    padding: 4px;
    font-weight: 600;
    box-shadow: 2px 2px 12px #000000;
    opacity: 0;
    -webkit-animation: textFlash 5s;
    -moz-animation: textFlash 5s;
    -o-animation: textFlash 5s;
    animation: textFlash 5s;
}

    @-webkit-keyframes textFlash {
        0% { opacity: 0; left: -1000px }
        13% { opacity: 0; left: -1000px }
        28% { opacity: 1; left: 0px }
        92% { opacity: 1; left: 0px }
        99% { opacity: 0; left: -1000px }
        100% { opacity: 0; left: -1000px }
    }

    @-moz-keyframes textFlash {
        0% { opacity: 0; left: -1000px }
        13% { opacity: 0; left: -1000px }
        28% { opacity: 1; left: 0px }
        92% { opacity: 1; left: 0px }
        99% { opacity: 0; left: -1000px }
        100% { opacity: 0; left: -1000px }
    }

    @-o-keyframes textFlash {
        0% { opacity: 0; left: -1000px }
        13% { opacity: 0; left: -1000px }
        28% { opacity: 1; left: 0px }
        92% { opacity: 1; left: 0px }
        99% { opacity: 0; left: -1000px }
        100% { opacity: 0; left: -1000px }
    }

    @keyframes textFlash {
        0% { opacity: 0; left: -1000px }
        13% { opacity: 0; left: -1000px }
        28% { opacity: 1; left: 0px }
        92% { opacity: 1; left: 0px }
        99% { opacity: 0; left: -1000px }
        100% { opacity: 0; left: -1000px }
    }