/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 2017-07-28, 13:25:49
    Author     : wchmiel
*/

#loadingEff {
    width: 100%; 
    height: 100%; 
    background-color: white; 
    opacity: 0.9;
    z-index:10000; 
    position: fixed;
    display: flex;
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    align-items: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
}

#loader {
    /*border: 3px solid transparent;
    border-top: 3px solid rgba(0,0,0,0.8);
    border-right: 3px solid rgba(0,0,0,0.8);
    border-radius: 50%;
    width: 60px;
    height: 60px;
    background-color: transparent;
    animation: spinEffect 600ms linear infinite;
    -webkit-animation: spinEffect 600ms linear infinite;
    -moz-animation: spinEffect 600ms linear infinite;
    -ms-animation: spinEffect 600ms linear infinite;*/
    width: 32px;
    height: 32px;
    background-image: url('../../images/loader.gif');
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);    
}

@media (max-width: 768px) {
    #loader {
        width: 32px;
        height: 32px;
    }
}

@keyframes spinEffect {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}