﻿.egns-preloader {
    position: fixed !important;
    z-index: 99999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
    .egns-preloader::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #fff;
        z-index: -1;
    }
    .egns-preloader .circle-border {
        width: 100%;
        max-width: 140px;
        height: 100%;
        max-height: 140px;
        border: 1px solid var(--custom);
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        margin: auto;
        border-radius: 50%;
        /*box-shadow: 2px 2px 30px rgba(0,0,0,.1);*/
    }
        .egns-preloader .circle-border img {
            position: absolute;
            left: 50%;
            top: 50%;
            height: 80%;
            transform: translate(-50%, -50%)
        }

        .egns-preloader .circle-border svg {
            fill: var(--custom);
        }

            .egns-preloader .circle-border svg path {
                stroke: var(--custom);
            }

        .egns-preloader .circle-border .moving-circle {
            width: 10px;
            height: 10px;
            /*background: var(--custom);*/
            background: #60be3e;
            border-radius: 50%;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            overflow: hidden;
            margin: auto;
            animation: circle 1s linear infinite;
        }

            .egns-preloader .circle-border .moving-circle:nth-child(2) {
                width: 10px;
                height: 10px;
                /*background: var(--custom);*/
                background: #f3af3a;
                border-radius: 50%;
                position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                overflow: hidden;
                margin: auto;
                animation: circle 1.5s linear infinite;
            }

            .egns-preloader .circle-border .moving-circle:nth-child(3) {
                width: 10px;
                height: 10px;
                /*background: var(--custom);*/
                background: #1796d2;
                border-radius: 50%;
                position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                overflow: hidden;
                margin: auto;
                animation: circle 2s linear infinite;
            }

@keyframes circle {
    0% {
        transform: rotate(0deg) translate(-70px) rotate(0deg);
    }

    100% {
        transform: rotate(360deg) translate(-70px) rotate(-360deg);
    }
}

.egns-preloader.close {
    display: none;
    visibility: hidden;
}

.egns-preloader.close {
    display: none;
    visibility: hidden;
}

.preloader-close-btn {
    position: absolute;
    right: 20px;
    top: 30px;
    font-size: 16px;
    transition: ease-in-out .5s linear;
    text-transform: uppercase;
    font-weight: 400;
    cursor: pointer;
}
