/* Testo ridotto se troppo lungo... */ .text-reduced, .text-reduced-a, .text-reduced-b, .text-reduced-c { height: 1.1rem; line-height: 0.9em; /*overflow: hidden;*/ /*position: relative;*/ /*width: 100%;*/ /*white-space: nowrap;*/ overflow-wrap: anywhere; } .text-reduced-a { font-size: 0.95rem; } .text-reduced-b { font-size: 0.9rem; } .text-reduced-c { font-size: 0.85rem; } /* gestione scroll testo A: 100% */ .scroll-left, .scroll-left-a, .scroll-left-b, .scroll-left-c { height: 1.25em; overflow: hidden; position: relative; width: 100%; white-space: nowrap; } .scroll-left span, .scroll-left-a span, .scroll-left-b span, .scroll-left-c span { position: absolute; width: 100%; height: 100%; margin: 0; line-height: 1.25em; /* Starting position */ -moz-transform: translateX(0%); -webkit-transform: translateX(0%); transform: translateX(0%); } /* gestione scroll testo A: 90% */ .scroll-left-a span { /* Apply animation to this element */ -moz-animation: scroll-left-a 10s ease infinite; -webkit-animation: scroll-left-a 10s ease infinite; animation: scroll-left-a 10s ease infinite; } /* Move it (define the animation) */ @keyframes scroll-left-a { 0% { transform: translateX(0%); } 30% { transform: translateX(0%); } 100% { transform: translateX(-90%); } } /* gestione scroll testo B: 100% */ .scroll-left-b span { /* Apply animation to this element */ -moz-animation: scroll-left-b 10s ease infinite; -webkit-animation: scroll-left-b 10s ease infinite; animation: scroll-left-b 10s ease infinite; } /* Move it (define the animation) */ @keyframes scroll-left-b { 0% { transform: translateX(0%); } 30% { transform: translateX(0%); } 100% { transform: translateX(-120%); } } /* gestione scroll testo C: 150% */ .scroll-left-c span { /* Apply animation to this element */ -moz-animation: scroll-left-c 10s ease infinite; -webkit-animation: scroll-left-c 10s ease infinite; animation: scroll-left-c 10s ease infinite; } /* Move it (define the animation) */ @keyframes scroll-left-c { 0% { transform: translateX(0%); } 30% { transform: translateX(0%); } 100% { transform: translateX(-150%); } }