@keyframes pulse {
	0% { transform:scale(0.25); }
	15% { transform:scale(0.35); }
	30% { transform:scale(0.25); }
}

loader {
    /*animation: 0.1s cubic-bezier(0.4, 0, 0.2, 1) 0s normal forwards 1 running ls-intro;*/
    display: inline-block;
    font-size: 0;
    height: 4px;
    position: relative;
    /*transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1) 0s;*/
    vertical-align: middle;
    width: 20px;
}

loader .node {
    display: block;
    height: 4px;
    left: -6px;
    position: absolute;
    top: -6px;
    width: 16px;
}
loader .node:before, loader .node:after {
    animation: 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0s normal none infinite running pulse;
    background: #3b78e7 none repeat scroll 0 0;
    border-radius: 50%;
    content: "";
    display: block;
    height: 16px;
    position: absolute;
    transform: scale(0.25);
    width: 16px;
}
loader .node:nth-child(1):before {
    animation-delay: 0.1s;
    left: 0;
}
loader .node:nth-child(1):after {
    animation-delay: 0.25s;
    left: 8px;
}
loader .node:nth-child(2):before {
    animation-delay: 0.4s;
    left: 16px;
}
loader .node:nth-child(2):after {
    display: none;
}



.loadingdots {
    position: fixed;
    top: 50%;
	left: calc(50% - 25px);
 	z-index: 35;
	width: 50px;	
}
.loadingdots .dot {
    animation: 1s ease-in-out 0s normal both infinite running dots;
    background-color: #9ECEF8; /*  #ccc */
    border-radius: 100%;
    display: inline-block;
}
.loadingdots .dot {
    height: 8px;
    margin: 0 2px;
    width: 8px;
}
.loadingdots .second {
    animation-delay: -0.16s;
}
.loadingdots .first {
    animation-delay: -0.32s;
}
@-webkit-keyframes dots{0%,80%,100%{-webkit-transform:scale(0)}40%{-webkit-transform:scale(1)}}@keyframes dots{0%,80%,100%{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}