.preloader{
  background: #59595c;
  height:100%;
  width:100%;
  position:fixed;
  bottom:0;
  z-index:99999;
}

.logo-container, .loader-container {
  position: absolute;
  bottom: -800px;
  left: 40%;
}
.logo-container{
	top:30%;
}
.loader-container{
	top:60%;
}
.logo-container {
  width: 20%;
  margin: 0 auto;
  text-align:center;
}

 .logo-container img{
  
  }

@media(max-width: 400px){
  .logo-container{
    width: 70%;
    left:15%;
  }
.logo-container img{
  width:100%;
  }
}

.loader-container{
  width: 20%;
  margin: 0 auto;
  text-align: center;
}

 
.loader {
  display: inline-block;
  width: 40px;
  height: 40px;
  position: relative;
  border: 1px solid #2eb7af;
}
.loader:before 
{
    content:"";
    display:block;
    position:absolute;
    z-index:-1;
    top:-4px;
    left:-4px;
    right:-4px;
    bottom:-4px;
    border:1px solid #fff;
}

.loader-inner {
  position: absolute;
  bottom: 0;
  right:0;
  display: inline-block;
  width: 100%;
  background-color: #2eb7af;
  -webkit-animation: loader-inner 8s infinite ease-in;
  -moz-animation: loader-inner 8s infinite ease-in;
  animation: loader-inner 8s infinite ease-in;

}

@-webkit-keyframes loader-inner{
    0% {
      height: 0%;
    }
    
    25% {
      height: 0%;
    }
    
    50% {
      height: 100%;
    }
    
    75% {
      height: 100%;
    }

    100% {
      height: 100%;
    }

}

@-moz-keyframes loader-inner {
  0% {
    height: 0%;
  }
  
  25% {
    height: 0%;
  }
  
  50% {
    height: 100%;
  }
  
  75% {
    height: 100%;
  }

  100% {
      height: 100%;
    }

}


@keyframes loader-inner {
  0% {
    height: 0%;
  }
  
  25% {
    height: 0%;
  }
  
  50% {
    height: 100%;
  }
  
  75% {
    height: 100%;
  }

  100% {
      height: 100%;
    }
  
}