.typewriter {
  font-family: monospace; /* Шрифт, имитирующий печатающую машинку */
  font-size: 18px;
  line-height: 1.2;
}

#typewriter-text {
  color: #333; /* Цвет основного текста */
  font-weight: bold;
  margin-bottom: 10px;
}

#typewriter-subtext {
  color: #666; /* Цвет дополнительного текста */
  font-size: 16px;
  margin-top: 0;
}.mouse-wheel-animation {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%; /* Высота контейнера, может быть изменена */
}
.capsule-shape {
  position: relative;
  width: 20px; /* Уменьшена ширина на 50% (40px -> 20px) */
  height: 80px; /* Уменьшена высота на 50% (160px -> 80px) */
  border: 2px solid #FFFFFF; /* Уменьшена толщина границы на 50% (4px -> 2px) */
  border-radius: 10px; /* Уменьшен радиус на 50% (20px -> 10px) */
  overflow: hidden;
  background-color: transparent;
}

.moving-strip {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 2px; /* Уменьшена ширина на 50% (4px -> 2px) */
  height: 20%; /* Высота полоски остаётся относительной, но теперь относительно новой высоты капсулы */
  background-color: #FFFFFF;
  animation: move-strip 0.665s infinite; /* Уменьшено время анимации на 50% (1.33s -> 0.665s) */
}

@keyframes move-strip {
  0% {
    transform: translate(-50%, -50%) translateY(0);
  }
  50% {
    transform: translate(-50%, -50%) translateY(95%); /* Увеличено значение для движения до нижней границы на 50% (32% -> 48%) */
  }
  100% {
    transform: translate(-50%, -50%) translateY(0);
  }
}








