.instructions, a { text-align: center; }
.boxes, .boxes cbox, .boxes img { width: 100%; }
.instructions { padding: 10px; background-color: rgb(35, 47, 62); border-radius: 4px; color: rgb(255, 255, 255); margin-top: 20px; }
.boxes { margin: 10px 0px; }
.boxes > div { position: relative; display: inline-block; width: 32.5%; height: 50%; transition-duration: 0.2s; cursor: pointer; }
.boxes > div:hover { transform: scale(1.1, 1.1); }
.instructions table { width: 100%; }
.instructions td:first-child { padding-right: 10px; width: 10px; }
.instructions td:last-child { padding-left: 10px; width: 10px; }
@media (max-width: 479px) {
  .boxes > div { width: 32%; }
}
@media (max-width: 319px) {
  .boxes > div { width: 48%; }
}
@keyframes showSweetAlert {
  0% { transform: scale(0.7); }
  45% { transform: scale(1.05); }
  80% { transform: scale(0.95); }
  100% { transform: scale(1); }
}
@keyframes showSweetAlert {
  0% { transform: scale(0.7); }
  45% { transform: scale(1.05); }
  80% { transform: scale(0.95); }
  100% { transform: scale(1); }
}
@keyframes hideSweetAlert {
  0% { transform: scale(1); }
  100% { transform: scale(0.5); }
}
@keyframes hideSweetAlert {
  0% { transform: scale(1); }
  100% { transform: scale(0.5); }
}
@keyframes slideFromTop {
  0% { top: 0px; }
  100% { top: 50%; }
}
@keyframes slideFromTop {
  0% { top: 0px; }
  100% { top: 50%; }
}
@keyframes slideToTop {
  0% { top: 50%; }
  100% { top: 0px; }
}
@keyframes slideToTop {
  0% { top: 50%; }
  100% { top: 0px; }
}
@keyframes slideFromBottom {
  0% { top: 70%; }
  100% { top: 50%; }
}
@keyframes slideFromBottom {
  0% { top: 70%; }
  100% { top: 50%; }
}
@keyframes slideToBottom {
  0% { top: 50%; }
  100% { top: 70%; }
}
@keyframes slideToBottom {
  0% { top: 50%; }
  100% { top: 70%; }
}
@keyframes animateSuccessTip {
  0%, 54% { width: 0px; left: 1px; top: 19px; }
  70% { width: 50px; left: -8px; top: 37px; }
  84% { width: 17px; left: 21px; top: 48px; }
  100% { width: 25px; left: 14px; top: 45px; }
}
@keyframes animateSuccessTip {
  0%, 54% { width: 0px; left: 1px; top: 19px; }
  70% { width: 50px; left: -8px; top: 37px; }
  84% { width: 17px; left: 21px; top: 48px; }
  100% { width: 25px; left: 14px; top: 45px; }
}
@keyframes animateSuccessLong {
  0%, 65% { width: 0px; right: 46px; top: 54px; }
  84% { width: 55px; right: 0px; top: 35px; }
  100% { width: 47px; right: 8px; top: 38px; }
}
@keyframes animateSuccessLong {
  0%, 65% { width: 0px; right: 46px; top: 54px; }
  84% { width: 55px; right: 0px; top: 35px; }
  100% { width: 47px; right: 8px; top: 38px; }
}
@keyframes rotatePlaceholder {
  0%, 5% { transform: rotate(-45deg); }
  100%, 12% { transform: rotate(-405deg); }
}
@keyframes rotatePlaceholder {
  0%, 5% { transform: rotate(-45deg); }
  100%, 12% { transform: rotate(-405deg); }
}
@keyframes animateErrorIcon {
  0% { transform: rotateX(100deg); opacity: 0; }
  100% { transform: rotateX(0deg); opacity: 1; }
}
@keyframes animateErrorIcon {
  0% { transform: rotateX(100deg); opacity: 0; }
  100% { transform: rotateX(0deg); opacity: 1; }
}
@keyframes animateXMark {
  0%, 50% { transform: scale(0.4); margin-top: 26px; opacity: 0; }
  80% { transform: scale(1.15); margin-top: -6px; }
  100% { transform: scale(1); margin-top: 0px; opacity: 1; }
}
@keyframes animateXMark {
  0%, 50% { transform: scale(0.4); margin-top: 26px; opacity: 0; }
  80% { transform: scale(1.15); margin-top: -6px; }
  100% { transform: scale(1); margin-top: 0px; opacity: 1; }
}
@keyframes pulseWarning {
  0% { border-color: rgb(248, 212, 134); }
  100% { border-color: rgb(248, 187, 134); }
}
@keyframes pulseWarning {
  0% { border-color: rgb(248, 212, 134); }
  100% { border-color: rgb(248, 187, 134); }
}
@keyframes pulseWarningIns {
  0% { background-color: rgb(248, 212, 134); }
  100% { background-color: rgb(248, 187, 134); }
}
@keyframes pulseWarningIns {
  0% { background-color: rgb(248, 212, 134); }
  100% { background-color: rgb(248, 187, 134); }
}
@keyframes rotate-loading {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
@keyframes rotate-loading {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
@keyframes ball-fall {
  0% { opacity: 0; transform: translateY(-145%); }
  10%, 90% { opacity: 0.5; }
  20%, 80% { opacity: 1; transform: translateY(0px); }
  100% { opacity: 0; transform: translateY(145%); }
}
@keyframes ball-fall {
  0% { opacity: 0; transform: translateY(-145%); }
  10%, 90% { opacity: 0.5; }
  20%, 80% { opacity: 1; transform: translateY(0px); }
  100% { opacity: 0; transform: translateY(145%); }
}
@keyframes bounce {
  0%, 100%, 20%, 53%, 80% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0px, 0px, 0px); }
  40%, 43% { animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); transform: translate3d(0px, -30px, 0px); }
  70% { animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); transform: translate3d(0px, -15px, 0px); }
  90% { transform: translate3d(0px, -4px, 0px); }
}
.bounce { animation-name: bounce; transform-origin: center bottom; }
@keyframes bounceIn {
  0%, 100%, 20%, 40%, 60%, 80% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); }
  20% { transform: scale3d(1.1, 1.1, 1.1); }
  40% { transform: scale3d(0.9, 0.9, 0.9); }
  60% { opacity: 1; transform: scale3d(1.03, 1.03, 1.03); }
  80% { transform: scale3d(0.97, 0.97, 0.97); }
  100% { opacity: 1; transform: scale3d(1, 1, 1); }
}
@keyframes bounceIn {
  0%, 100%, 20%, 40%, 60%, 80% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); }
  20% { transform: scale3d(1.1, 1.1, 1.1); }
  40% { transform: scale3d(0.9, 0.9, 0.9); }
  60% { opacity: 1; transform: scale3d(1.03, 1.03, 1.03); }
  80% { transform: scale3d(0.97, 0.97, 0.97); }
  100% { opacity: 1; transform: scale3d(1, 1, 1); }
}