@-webkit-keyframes scroll {
  0% {    -webkit-transform: translateY(0);  }
  50% {    -webkit-transform: translateY(10px);  }
  100% {    -webkit-transform: translateY(0);  }
}
@-moz-keyframes scroll {
  0% {    -moz-transform: translateY(0);  }
  50% {    -moz-transform: translateY(10px);  }
  100% {    -moz-transform: translateY(0);  }
}
@keyframes scroll {
  0% { -webkit-transform: translateY(0);  -moz-transform: translateY(0);
    -ms-transform: translateY(0);  -o-transform: translateY(0);  transform: translateY(0); }
  50% { -webkit-transform: translateY(10px); -moz-transform: translateY(10px);
    -ms-transform: translateY(10px); -o-transform: translateY(10px);  transform: translateY(10px);  }
  100% { -webkit-transform: translateY(0); -moz-transform: translateY(0);
    -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0);  }
}

.center-it { z-index:1;  position: absolute;  bottom: 0.5%;  left: 150px; }

.center-it .caption { font-size:16px; text-align:center; color:#333; opacity:0.8;  writing-mode: vertical-rl;
text-align:center; padding-left:3px; color:#bcbcbc;}

.mouse {  display: inline-block;  height: 44px; width: 28px; border-radius: 12px;  padding-top:8px;
border: 0px solid #333; text-align: center; opacity:0.7}
.mouse:after {  display: inline-block; height: 28px; width: 11px;  border-radius: 0px;
  content: "";  -webkit-animation: scroll 1.5s ease-out infinite forwards;background:url(../img/arrow.png)no-repeat center;
  -moz-animation: scroll 1.5s ease-out infinite forwards;  animation: scroll 1.5s ease-out infinite forwards;}

/*---------------------------------------
  MOBILE RESPONSIVE              
-----------------------------------------*/
@media (max-width: 1023px) {
.center-it {display:none;}
}
@media (max-width: 768px) {
}
@media (max-width: 640px) {
}
@media (max-width: 480px) {
}
@media (max-width: 320px) {
}