/* =Loader
-------------------------------------------------------------- */
@keyframes loader-anim {
    0% {
        left: -102px
    }

    100% {
        left: 102px
    }
}

@keyframes blink-text {
    0% {
        opacity: 1
    }

    20% {
        opacity: 0.5
    }

    40% {
        opacity: 0.2
    }

    60% {
        opacity: 0.7
    }

    80% {
        opacity: 0.1
    }

    90% {
        opacity: 0.4
    }
}
#pageloader {
    background-color:#fff;

    position:absolute;
    z-index:99999999999999;
    width:100%;
    height:100%;
    left:0;
    right:0;
    top:0;
    bottom:0;
}

.pageloader-fade {
    opacity:0 !important;
    
    -webkit-transition: all .75s ease;
    -moz-transition: all .75s ease;
    -o-transition: all .75s ease;
    -ms-transition: all .75s ease;
    transition: all .75s ease;
}

.pageloader-hide {
    display:none;
}

.pageloader-content {
    text-align: center;
    overflow: hidden;
    position: absolute;
    top: 50%;
    margin-top: -12px;
    left: 50%;
    margin-left: -50px;
    width: 100px;
    height: 24px;
}

.pageloader-content-hide {
    opacity:0 !important;
    
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    -o-transition: all .25s ease;
    -ms-transition: all .25s ease;
    transition: all .25s ease;
}

.pageloader-content h4 {
    color: #272727;
    -webkit-animation: blink-text 1s infinite;
       -moz-animation: blink-text 1s infinite;
        -ms-animation: blink-text 1s infinite;
         -o-animation: blink-text 1s infinite;
            animation: blink-text 1s infinite;
}

.progress {
    display: block;
    position: absolute;
    bottom: 1px;
    overflow: hidden;
    width: 100px;
    height: 1px;
    left: -102px;
    background-color: #00d9ec;
    -webkit-animation: loader-anim 1s 0s infinite cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -moz-animation: loader-anim 1s 0s infinite cubic-bezier(0.785, 0.135, 0.15, 0.86);
    animation: loader-anim 1s 0s infinite cubic-bezier(0.785, 0.135, 0.15, 0.86)
}


/* =SUBMENU Loader
-------------------------------------------------------------- */
.lds-roller {
    /*display: inline-block;*/
    position: relative;
    width: 64px;
    height: 64px;
    margin: auto;
    /*margin-top: 30px;*/
}
@media all and (min-width: 700px) {
    .lds-roller { margin: 0}
    .gallery-container .lds-roller{
        margin: auto;
    }
}
.lds-roller div {
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    transform-origin: 32px 32px;
}
.lds-roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #6f6f6f;
    margin: -3px 0 0 -3px;
}
.lds-roller div:nth-child(1) {
    animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
    top: 50px;
    left: 50px;
}
.lds-roller div:nth-child(2) {
    animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
    top: 54px;
    left: 45px;
}
.lds-roller div:nth-child(3) {
    animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
    top: 57px;
    left: 39px;
}
.lds-roller div:nth-child(4) {
    animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
    top: 58px;
    left: 32px;
}
.lds-roller div:nth-child(5) {
    animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
    top: 57px;
    left: 25px;
}
.lds-roller div:nth-child(6) {
    animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
    top: 54px;
    left: 19px;
}
.lds-roller div:nth-child(7) {
    animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
    top: 50px;
    left: 14px;
}
.lds-roller div:nth-child(8) {
    animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
    top: 45px;
    left: 10px;
}
@keyframes lds-roller {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}