import {motion} from "framer-motion"


const slider = {
  initial:{x: 0,},
  animate:{x: "-100%",  transition:{ease: "linear", repeat: Infinity, duration: 120},},
};

const TextAnimation = () => {
  return (
    <div data-scroll data-scroll-sections data-scroll-speed="-0.1" className="bg-[#F1F1F1]">
         <div className="marquee-text w-full pt-28 pb-20 bg-[#004D43] rounded-t-3xl">
            <div className="flex border-t-[1px] border-b-[1px] border-[#ffffff50] text-[#FFFFFF] overflow-hidden whitespace-nowrap gap-40">
                <motion.h1  className="text-[400px] font-bold uppercase leading-none -mb-20" variants={slider} initial="initial" animate="animate">
                    We are ochi We are ochi We are ochi We are ochi We are ochi We are ochi We are ochi We are ochi We are ochi We are ochi
                </motion.h1>
            </div>
        </div>
    </div>
   
  )
}

export default TextAnimation