Movies

[singhritam95]

<title>CineHub - Watch Movies Online</title> <style> body { margin: 0; font-family: 'Arial', sans-serif; background: #141414; color: #fff; } header { background: rgba(0,0,0,0.8); padding: 20px; position: fixed; width: 100%; z-index: 10; display: flex; justify-content: space-between; align-items: center; } .logo { font-size: 2em; font-weight: bold; color: #e50914; } nav a { color: #fff; margin: 0 15px; text-decoration: none; } nav a:hover { color: #e50914; } .hero { height: 100vh; background: url('https://via.placeholder.com/1920x1080?text=Featured+Movie+Banner') center/cover; display: flex; align-items: center; justify-content: center; text-align: center; } .hero-content { background: rgba(0,0,0,0.6); padding: 40px; border-radius: 10px; } .hero h1 { font-size: 4em; } .btn { background: #e50914; color: #fff; padding: 15px 30px; border: none; border-radius: 5px; font-size: 1.2em; cursor: pointer; margin-top: 20px; } .btn:hover { background: #f40612; } .section { padding: 60px 40px; } .section h2 { font-size: 2em; margin-bottom: 20px; } .movies { display: flex; overflow-x: auto; gap: 20px; padding-bottom: 20px; } .movie-card { min-width: 250px; border-radius: 10px; overflow: hidden; box-shadow: 0 4px 10px rgba(0,0,0,0.5); } .movie-card img { width: 100%; height: 350px; object-fit: cover; } .movie-card p { padding: 10px; text-align: center; background: #221f1f; } footer { background: #000; padding: 20px; text-align: center; } ::-webkit-scrollbar { height: 8px; } ::-webkit-scrollbar-thumb { background: #e50914; } @media (max-width: 768px) { .hero h1 { font-size: 2.5em; } } </style>

CineHub

Home Movies TV Shows New Search

<section class="hero">
    <div class="hero-content">
        <h1>Unlimited Movies & TV Shows</h1>
        <p>Watch anywhere. Cancel anytime.</p>
        <button class="btn">Start Watching Now</button>
    </div>
</section>

<section class="section">
    <h2>Trending Now</h2>
    <div class="movies">
        <div class="movie-card"><img src="https://via.placeholder.com/250x350?text=Movie+1" alt="Movie"><p>Action Movie 1</p></div>
        <div class="movie-card"><img src="https://via.placeholder.com/250x350?text=Movie+2" alt="Movie"><p>Thriller 2026</p></div>
        <div class="movie-card"><img src="https://via.placeholder.com/250x350?text=Movie+3" alt="Movie"><p>Comedy Hit</p></div>
        <div class="movie-card"><img src="https://via.placeholder.com/250x350?text=Movie+4" alt="Movie"><p>Sci-Fi Epic</p></div>
        <div class="movie-card"><img src="https://via.placeholder.com/250x350?text=Movie+5" alt="Movie"><p>Drama</p></div>
    </div>
</section>

<section class="section" style="background: #221f1f;">
    <h2>Top Rated</h2>
    <div class="movies">
        <div class="movie-card"><img src="https://via.placeholder.com/250x350?text=Top+1" alt="Movie"><p>Classic Masterpiece</p></div>
        <div class="movie-card"><img src="https://via.placeholder.com/250x350?text=Top+2" alt="Movie"><p>Oscar Winner</p></div>
        <div class="movie-card"><img src="https://via.placeholder.com/250x350?text=Top+3" alt="Movie"><p>Blockbuster</p></div>
        <div class="movie-card"><img src="https://via.placeholder.com/250x350?text=Top+4" alt="Movie"><p>Superhero</p></div>
    </div>
</section>

<footer>
    <p>&copy; 2026 CineHub - Your Personal Movie Hub</p>
</footer>