/*================ ss loader css style start ==========================*/

.ss_loader_main{
    position: fixed;
    /* display: flex;
    align-items: center;
    justify-content: center; */
    width: 100%;
    height: 100%;
    z-index: 999999999999999999999999999999999999;
    display: none;
    background-color: #00000067;
}
        
.ss_loader_main_inner{
    width: 160px;
    height: 160px;
    /* background-color: cornflowerblue; */
    position:relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ss_loader_main_inner_box{
    height: 160px;
    width: 160px;
    min-width: 160px;
    border-radius: 50%;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 6px 6px 10px -1px rgba(0,0,0,0.15),
                -6px -6px 10px -1px rgba(255,255,255,0.7);
}

.ss_loader_main_inner_box_inner{
    height:120px ;
    width: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: inset 4px 4px 6px -1px rgba(0,0,0,0.2),
                inset -4px 4px 6px -1px rgba(255,255,255,0.7),
                -0.5px -0.5px 0px rgba(255,255,255,1),
                0.5px 0.5px 0px rgba(0,0,0,0.15),
                0px 12px 10px -10px rgba(0,0,0,0.5);
}

#ss_loader_main_inner_number{
    font-weight: 600;
    color: #eee;
    font-size: 2.4rem;
    text-align: center;
}

#ss_loader_main_inner_box_inner_svg_circle{
    fill: none;
    stroke: url(#GradientColor);
    stroke-width: 20px;
    stroke-dasharray: 472 ;
    stroke-dashoffset: 472;
    animation: loaderSVGAnim 3.2s linear forwards;
}

/* #ss_loader_main_inner_box_inner_svg{
    position: absolute;
    top: 0;
    left: 0;
} */

@keyframes loaderSVGAnim{
    100%{
        stroke-dashoffset: 2;
        
    }
}

            /*================ ss loader css style end ==========================*/