Your browser does not support the video tag.
.no-transition {
transition: none !important;
}
.journey-port {
&:hover,
&.active {
.journey-plus {
display: block;
}
.journey-port-text {
color: black;
}
}
&.passed {
.journey-dot {
background-color: black;
border: none;
}
}
.journey-plus {
display: none;
}
}
.progress-line-track {
overflow: hidden;
.progress-inner {
transform: translateX(-100%);
width: 100%;
transform-origin: left;
transition: transform 4s linear;
}
}
.image-container {
img {
filter: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.2));
}
}
.image-list,
.text-list {
transition: transform 1s ease;
}
@keyframes text-moving {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-66.66667%);
}
}
.text-animation-liner {
animation: text-moving 12s linear infinite;
.text-animation-item {
padding-right: 200px;
}
}
html:not(.wf-design-mode) {
.accordion-list {
position: relative;
.div-block-26 {
position: static;
.grid-wrapper {
top: 0;
}
}
.accordion-item {
.arrow-icon {
pointer-events: all;
opacity: 1;
transition: ease 0.5s opacity;
transition-delay: 0.2s;
}
.accordion-cta {
pointer-events: none;
opacity: 0;
transition: ease 0.5s opacity;
transition-delay: 0.2s;
}
.accordion-content-right {
height: 0;
opacity: 0;
transition: ease 0.5s all;
transition-delay: 0.2s;
}
.accordion-content {
height: 0;
opacity: 0;
transition: ease 0.5s all;
}
&[data-active="true"] {
.arrow-icon {
pointer-events: none;
opacity: 0;
transition: ease 0.5s opacity;
transition-delay: 0.2s;
}
.accordion-cta {
pointer-events: all;
opacity: 1;
transition-delay: 0.7s;
}
.accordion-content-right,
.accordion-content {
height: auto;
opacity: 1;
}
.accordion-content-right {
transition-delay: 0.5s;
}
}
}
}
}
@keyframes background-moving {
0% {
background-position: 100%, 0 0;
}
100% {
background-position: 127%, 0 0;
}
}
.button {
.progress-mask {
transition: transform 0.3s ease;
}
&:hover {
.progress-mask {
transform: translateX(100%);
animation: background-moving 0.5s linear infinite;
}
}
}
@media screen and (max-width: 991px) {
.journey-plus {
display: none;
}
.journey-port-text {
color: #0000004d;
}
}
.text-span {
position: relative;
&::after {
content: "";
position: absolute;
left: -12px;
right: -12px;
top: 96%;
height: 13px;
background: url(https://cdn.prod.website-files.com/66c415b492b9529eb6b0d291/66c708929e1e504d9530e64e_red-plus.svg)
left no-repeat,
url(https://cdn.prod.website-files.com/66c415b492b9529eb6b0d291/66c708929e1e504d9530e64e_red-plus.svg)
right no-repeat;
background-size: 23px;
z-index: -2;
}
&::before {
content: "";
position: absolute;
left: 11px;
right: 11px;
top: 96%;
height: 6.4px;
border-bottom: 1px solid black;
z-index: -1;
}
}
