       }, 100);
            return () => clearInterval(interval);
        }, []);

        return (
            <div className="container">
                <ul className="nav nav-tabs" role="tablist" style={{borderBottom: 0}}>
                    {chapters.map(chapter => (
                        <li key={chapter.number} className="nav-item mx-1" role="presentation">
                            <button
                                className={`nav-link ${chapter.number === 0 ? "active" : ""}`}
           