#loader {
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
    top: 50%;
    width: 88px;
    z-index: 9999;
}
#loader ul {
    margin: 0;
    list-style: none;
    width: 88px;
    height: 63px;
    position: relative;
    padding: 0;
    height: 10px;
}
#loader ul li {
    position: absolute;
    width: 2px;
    height: 0;
    background-color: #2ca9af;
    bottom: 0;
}

#loader li:nth-child(1) {
    left: 0;
    animation: sequence1 1.15s ease infinite 0;
    -o-animation: sequence1 1.15s ease infinite 0;
    -ms-animation: sequence1 1.15s ease infinite 0;
    -webkit-animation: sequence1 1.15s ease infinite 0;
    -moz-animation: sequence1 1.15s ease infinite 0;
}
#loader li:nth-child(2) {
    left: 15px;
    animation: sequence2 1.15s ease infinite 0.12s;
    -o-animation: sequence2 1.15s ease infinite 0.12s;
    -ms-animation: sequence2 1.15s ease infinite 0.12s;
    -webkit-animation: sequence2 1.15s ease infinite 0.12s;
    -moz-animation: sequence2 1.15s ease infinite 0.12s;
}
#loader li:nth-child(3) {
    left: 29px;
    animation: sequence1 1.15s ease-in-out infinite 0.23s;
    -o-animation: sequence1 1.15s ease-in-out infinite 0.23s;
    -ms-animation: sequence1 1.15s ease-in-out infinite 0.23s;
    -webkit-animation: sequence1 1.15s ease-in-out infinite 0.23s;
    -moz-animation: sequence1 1.15s ease-in-out infinite 0.23s;
}
#loader li:nth-child(4) {
    left: 44px;
    animation: sequence2 1.15s ease-in infinite 0.35s;
    -o-animation: sequence2 1.15s ease-in infinite 0.35s;
    -ms-animation: sequence2 1.15s ease-in infinite 0.35s;
    -webkit-animation: sequence2 1.15s ease-in infinite 0.35s;
    -moz-animation: sequence2 1.15s ease-in infinite 0.35s;
}
#loader li:nth-child(5) {
    left: 58px;
    animation: sequence1 1.15s ease-in-out infinite 0.46s;
    -o-animation: sequence1 1.15s ease-in-out infinite 0.46s;
    -ms-animation: sequence1 1.15s ease-in-out infinite 0.46s;
    -webkit-animation: sequence1 1.15s ease-in-out infinite 0.46s;
    -moz-animation: sequence1 1.15s ease-in-out infinite 0.46s;
}
#loader li:nth-child(6) {
    left: 73px;
    animation: sequence2 1.15s ease infinite 0.58s;
    -o-animation: sequence2 1.15s ease infinite 0.58s;
    -ms-animation: sequence2 1.15s ease infinite 0.58s;
    -webkit-animation: sequence2 1.15s ease infinite 0.58s;
    -moz-animation: sequence2 1.15s ease infinite 0.58s;
}

@keyframes sequence1 {
    0% {
        height: 10px;
    }
    50% {
        height: 49px;
    }
    100% {
        height: 10px;
    }
}

@-o-keyframes sequence1 {
    0% {
        height: 10px;
    }
    50% {
        height: 49px;
    }
    100% {
        height: 10px;
    }
}

@-ms-keyframes sequence1 {
    0% {
        height: 10px;
    }
    50% {
        height: 49px;
    }
    100% {
        height: 10px;
    }
}

@-webkit-keyframes sequence1 {
    0% {
        height: 10px;
    }
    50% {
        height: 49px;
    }
    100% {
        height: 10px;
    }
}

@-moz-keyframes sequence1 {
    0% {
        height: 10px;
    }
    50% {
        height: 49px;
    }
    100% {
        height: 10px;
    }
}

@keyframes sequence2 {
    0% {
        height: 19px;
    }
    50% {
        height: 63px;
    }
    100% {
        height: 19px;
    }
}

@-o-keyframes sequence2 {
    0% {
        height: 19px;
    }
    50% {
        height: 63px;
    }
    100% {
        height: 19px;
    }
}

@-ms-keyframes sequence2 {
    0% {
        height: 19px;
    }
    50% {
        height: 63px;
    }
    100% {
        height: 19px;
    }
}

@-webkit-keyframes sequence2 {
    0% {
        height: 19px;
    }
    50% {
        height: 63px;
    }
    100% {
        height: 19px;
    }
}

@-moz-keyframes sequence2 {
    0% {
        height: 19px;
    }
    50% {
        height: 63px;
    }
    100% {
        height: 19px;
    }
}