.scrolling-scripts {
width: max-content!important;
margin: 0!important;
--item-height:100px; /* the height of the visible "window" */
--cycle: 5s; /* total loop time; each word gets cycle / number of words */
}
/* Clip at every level so nothing can show outside the box */
.scrolling-scripts,
.scrolling-scripts .fusion-column-wrapper {
/* width: 500px!important; */
height: var(--item-height) !important;
min-height: 0 !important;
margin-bottom: 0 !important;
overflow: hidden !important;
clip-path: inset(0);
}
/* Stack the words in one grid cell so the box is as wide as the widest word */
.scrolling-scripts .fusion-column-wrapper {
display: grid !important;
justify-items: center;
align-items: center;
}
.scrolling-scripts .fusion-text {
grid-area: 1 / 1;
width: 200px;
height: var(--item-height);
display: flex;
align-items: center; /* vertically centers the word in the box */
justify-content: center;
animation: word-scroll var(--cycle) infinite;
animation-fill-mode: backwards;
}
.scrolling-scripts .fusion-text p {
margin: 0;
line-height: var(--item-height) !important;
white-space: nowrap;
}
.scrolling-scripts .fusion-text-43 { animation-delay: 0s; }
.scrolling-scripts .fusion-text-44 { animation-delay: calc(var(--cycle) / 2); }
@keyframes word-scroll {
0% { transform: translateY(100%); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
12% { transform: translateY(0); }
50% { transform: translateY(0); animation-timing-function: cubic-bezier(.65, 0, .35, 1); }
62% { transform: translateY(-100%); }
100% { transform: translateY(-100%); }
}
@media (prefers-reduced-motion: reduce) {
.scrolling-scripts .fusion-text { animation: none; }
.scrolling-scripts .fusion-text-44 { display: none; }
}
The Best of
Tennis
Miami
.experience-tabs.mobile-mode-carousel > .nav {
display: flex!important;
align-items: center;
justify-content: center!important;
}
.experience-tabs .nav-tabs {
justify-content: center;
background: #F7F7F7!important;
padding: 0.75rem;
border-radius: 12px;
width: max-content;
}
.experience-tabs li {
margin-bottom: 0!important;
}
.experience-tabs .tab-link {
min-width: 0;
width: max-content;
padding-left: 1.5rem!important;
padding-right: 1.5rem!important;
}
.experience-tabs .tab-link:hover {
background: transparent!important;
}
.experience-tabs .tab-link:hover .fusion-tab-heading {
color: #1A1A69!important;
}
.experience-tabs .active .tab-link:hover .fusion-tab-heading {
color: #FFF!important;
}
.experience-tabs .fusion-tab-heading {
font-family: "Itau Display - Regular", "Inter", sans-serif!important;
}
.experience-tabs .active .tab-link {
background: #1A1A69!important;
}
.experience-tabs .active .fusion-tab-heading {
font-family: "Itau Display - Bold", "Inter", sans-serif!important;
color: #FFF!important;
}
.experience-tabs .active .tab-link::after {
background: #4B98C7!important;
opacity: 0.4!important;
}
document.addEventListener('DOMContentLoaded', () => {
document.querySelectorAll('.grow-col').forEach(card => {
card.style.setProperty('--grow-delay', `${Math.random()*1.3}s`);
card.style.animationPlayState = 'running';
});
});
