style.css (7)

footer 공통

/* Footer */
.footer .social a {
  margin: 0 10px;
}

.fa-github:hover {
  color: #000000;
}

.fa-facebook:hover {
  color: #1773ea;
}

.fa-instagram:hover {
  color: #b32e87;
}

.fa-twitter:hover {
  color: #1c9cea;
}

애니메이션

/* 애니메이션 */
/* 왼쪽에서 오른쪽으로 */
@keyframes slideInFromLeft {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translateX(0);
  }
}
/* 오른쪽에서 왼쪽으로 */
@keyframes slideInFromRight {
  0% {
    transform: translateX(100%);
  }

  100% {
    transform: translateX(0);
  }
}
/* 위에서 아래로 */
@keyframes slideInFromTop {
  0% {
    transform: translateY(-100%);
  }

  100% {
    transform: translateX(0);
  }
}
/* 아래에서 위로 */
@keyframes slideInFromBottom {
  0% {
    transform: translateY(100%);
  }

  100% {
    transform: translateX(0);
  }
}