.preloader {
    height: 100vh;
    width: 100vw;
    position: fixed;
    margin: 0;
    padding: 0;
    z-index: 3 !important;
}

.overlay_top {
    z-index: 3000;
    left: 0;
    top: 0;
    width: 100%;
    height: 50%;
    position: fixed;
    background-color: #21beb1;
    background-image: url("../images/2.png");
    background-repeat: no-repeat;
    background-size: 40%;
    background-position: center;
    -webkit-transition: top 500ms ease-out;
    transition: top 500ms ease-out;

}

.overlay_bottom {
    z-index: 3000;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50%;
    position: fixed;
    background-color: #21beb1;
    -webkit-transition: bottom 500ms ease-out;
    transition: bottom 500ms ease-out;
    font-size: 100px;
    text-align: center;
    vertical-align: middle;
    color: #1b1b1b ;

}

#loader_bar {
    z-index: 3001;
    height: 5px;
    width: 1%;
    background-color: #1b1b1b;
    position: absolute;
    top: 50%;
}

#loader_text {
    z-index: 3001;
    top: 50%;
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}






/*/!* Demo Styles *!/*/
/*#content {*/
    /*margin: 0 auto;*/
    /*padding-bottom: 50px;*/
    /*width: 80%;*/
    /*max-width: 978px;*/
/*}*/

/*ul {*/
    /*list-style: square;*/
/*}*/
/*ul li a {*/
    /*text-decoration: none;*/
    /*color: #34495e;*/
    /*display: block;*/
    /*margin: 10px;*/
/*}*/
/*ul li a:hover {*/
    /*text-decoration: underline;*/
/*}*/

/*/!* The Loader *!/*/
/*#loader-wrapper {*/
    /*position: fixed;*/
    /*top: 0;*/
    /*left: 0;*/
    /*width: 100%;*/
    /*height: 100%;*/
    /*z-index: 10;*/
    /*overflow: hidden;*/
/*}*/
/*.no-js #loader-wrapper {*/
    /*display: none;*/
/*}*/

/*#loader {*/
    /*display: block;*/
    /*position: relative;*/
    /*left: 50%;*/
    /*top: 50%;*/
    /*width: 150px;*/
    /*height: 150px;*/
    /*margin: -75px 0 0 -75px;*/
    /*border-radius: 50%;*/
    /*border: 3px solid transparent;*/
    /*border-top-color: #16a085;*/
    /*-webkit-animation: spin 1.7s linear infinite;*/
    /*animation: spin 1.7s linear infinite;*/
    /*z-index: 11;*/
/*}*/
/*#loader:before {*/
    /*content: "";*/
    /*position: absolute;*/
    /*top: 5px;*/
    /*left: 5px;*/
    /*right: 5px;*/
    /*bottom: 5px;*/
    /*border-radius: 50%;*/
    /*border: 3px solid transparent;*/
    /*border-top-color: #e74c3c;*/
    /*-webkit-animation: spin-reverse .6s linear infinite;*/
    /*animation: spin-reverse .6s linear infinite;*/
/*}*/
/*#loader:after {*/
    /*content: "";*/
    /*position: absolute;*/
    /*top: 15px;*/
    /*left: 15px;*/
    /*right: 15px;*/
    /*bottom: 15px;*/
    /*border-radius: 50%;*/
    /*border: 3px solid transparent;*/
    /*border-top-color: #f9c922;*/
    /*-webkit-animation: spin 1s linear infinite;*/
    /*animation: spin 1s linear infinite;*/
/*}*/

/*@-webkit-keyframes spin {*/
    /*0% {*/
        /*-webkit-transform: rotate(0deg);*/
    /*}*/
    /*100% {*/
        /*-webkit-transform: rotate(360deg);*/
    /*}*/
/*}*/
/*@keyframes spin {*/
    /*0% {*/
        /*-webkit-transform: rotate(0deg);*/
        /*transform: rotate(0deg);*/
    /*}*/
    /*100% {*/
        /*-webkit-transform: rotate(360deg);*/
        /*transform: rotate(360deg);*/
    /*}*/
/*}*/
/*@-webkit-keyframes spin-reverse {*/
    /*0% {*/
        /*-webkit-transform: rotate(0deg);*/
    /*}*/
    /*100% {*/
        /*-webkit-transform: rotate(-360deg);*/
    /*}*/
/*}*/
/*@keyframes spin-reverse {*/
    /*0% {*/
        /*-webkit-transform: rotate(0deg);*/
        /*transform: rotate(0deg);*/
    /*}*/
    /*100% {*/
        /*-webkit-transform: rotate(-360deg);*/
        /*transform: rotate(-360deg);*/
    /*}*/
/*}*/
/*#loader-wrapper .loader-section {*/
    /*position: fixed;*/
    /*top: 0;*/
    /*width: 51%;*/
    /*height: 100%;*/
    /*background: #222;*/
    /*z-index: 10;*/
/*}*/

/*#loader-wrapper .loader-section.section-left {*/
    /*left: 0;*/
/*}*/

/*#loader-wrapper .loader-section.section-right {*/
    /*right: 0;*/
/*}*/

/*/!* Loaded styles *!/*/
/*.loaded #loader-wrapper .loader-section.section-left {*/
    /*-webkit-transform: translateX(-100%);*/
    /*transform: translateX(-100%);*/
    /*-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);*/
    /*transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);*/
/*}*/

/*.loaded #loader-wrapper .loader-section.section-right {*/
    /*-webkit-transform: translateX(100%);*/
    /*transform: translateX(100%);*/
    /*-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);*/
    /*transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);*/
/*}*/


/*.loaded #loader {*/
    /*opacity: 0;*/
    /*-webkit-transition: all 0.3s ease-out;*/
    /*transition: all 0.3s ease-out;*/
/*}*/

/*.loaded #loader-wrapper {*/
    /*visibility: hidden;*/
    /*-webkit-transform: translateY(-100%);*/
    /*transform: translateY(-100%);*/
    /*-webkit-transition: all 0.3s 1s ease-out;*/
    /*transition: all 0.3s 1s ease-out;*/
/*}*/