#text-container {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  max-width: 300px;
  opacity: 0;
  animation: slideIn 2s ease-out forwards; /* Trigger the animation */
  font-family: "Ballet", serif; /* Apply Ballet font */
  text-align: right; /* Adjust for Farsi */
  direction: rtl; /* Default direction for Farsi */
}

#text-container.eng {
  text-align: left; /* Adjust for English */
  direction: ltr; /* Adjust direction for English */
  font-family: "Ballet", serif; /* Apply Ballet font */
}

.ballet-test-text {
  font-family: "Ballet", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}


@keyframes slideIn {
  from {
    transform: translate(100%, -50%);
    opacity: 0;
  }
  to {
    transform: translateY(-50%);
    opacity: 1;
  }
}