.portfolio-filters {
  position: relative;
}

.portfolio-images {
  visibility: hidden;
}

.portfolio-ajax-container {
   transition: height .6s ease-in-out;
}

#ajax-loader {
    position: relative;
    margin: 0 auto;
    padding: 15px 0;
    display: block;
    /* visibility: hidden; */
    -webkit-transition: .5s;
    transition: .5s;
    z-index: 222;
    bottom: 0;
    left: 0;
    text-align: center;
    /* pointer-events: none; */
}

#ajax-loader .spinner {
  position: absolute;
  display: none;
  left: 50%;
  -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  width: 40px;
  top:0;
}

.spinner > div {
  width: 8px;
  height: 8px;
  background-color: #8d949e;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner > div:nth-of-type(0n+1) {
	background-color: #fff;
}

.spinner > div:nth-of-type(0n+2) {
	background-color: #8cb3ff;
}

.spinner > div:nth-of-type(0n+3) {
	background-color: #2361DD;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}
