.heading-scrolling {
    background: var(--background-color);
    padding-top: var(--padding-top);
    padding-bottom: var(--padding-bottom);
}

.heading-scrolling-container {
    overflow: hidden;
    width: 100%;
    transition: all 0.5s;
    transform: translateY(100px);
}

.is-visible .heading-scrolling-container {
    transform: translateY(0);
}

.heading-scrolling-container .company-main-title {
    font-size: 318px;
    text-transform: uppercase;
    color: var(--main-title-color);
    white-space: nowrap;
    font-style: italic;
    animation: smoothStoryScroll 20s ease-in-out infinite;
}

@keyframes smoothStoryScroll {

    0% {
        transform: translateX(0);
    }

    15% {
        transform: translateX(0);
    }

    35% {
        transform: translateX(-30%);
    }

    45% {
        transform: translateX(-30%);
    }

    65% {
        transform: translateX(-65%);
    }

    75% {
        transform: translateX(-65%);
    }

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

@media (max-width:1024px) {
    .heading-scrolling-container .company-main-title {
        font-size: 200px;
    }
}

@media (max-width:768px) {
    .heading-scrolling {
        padding-top: var(--padding-top-mobile);
        padding-bottom: var(--padding-bottom-mobile);
    }

    .heading-scrolling-container .company-main-title {
        font-size: 100px;
    }
}