.elementor-1122 .elementor-element.elementor-element-2e100f0c{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--flex-wrap:nowrap;--padding-top:20px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-1122 .elementor-element.elementor-element-2e100f0c:not(.elementor-motion-effects-element-type-background), .elementor-1122 .elementor-element.elementor-element-2e100f0c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-1122 .elementor-element.elementor-element-764be719{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}.elementor-1122 .elementor-element.elementor-element-764be719.elementor-element{--align-self:center;}/* Start custom CSS for html, class: .elementor-element-764be719 *//* Using em for your padding-left is going to ensure the padding scales in proportion to the font-size. */

.content {
    font-family: "Inter", sans-serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: #ffffff;
    padding-left: 0.25em;
}

@media only screen and (max-width: 767px) {
    .content {
        font-size: 2rem !important;
        padding-left: 0.25em;
    }
}

.outer {
    overflow: hidden;  !important;
}

.outer div {
    display: inline-block;
}

.loop {
    white-space: nowrap;
    animation: loop-anim 30s linear infinite;
}

@media only screen and (max-width: 767px) {
    .loop {
        animation: loop-anim 20.5s linear infinite;
    }
}

@keyframes loop-anim {
    0% {
        margin-left: 0;
    }
    100% {
        margin-left: -50% /* This works because of the div between "outer" and "loop" */
    }
}/* End custom CSS */