bharath
/
skyscraper


			
				
					
						
						
							
							<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Into Architecture</title>
</head>

<body>
    <header>
        <div class="logo-holder">
            <h1>Skyscraper</h1>
            <h2>Architecture</h2>
        </div>
        <div class="search-lang-nav-holder">
            <div class="search-lang-holder">
                <form class="header-form">
                    <div class="search">
                        <input type="text" placeholder="Search">
                        <button class="search-button">
                            <figure>
                                <img src="images/search.png" alt="search">
                            </figure>
                        </button>
                    </div>
                    <div class="lang">
                        <select name="" id="">
                            <option value="English">EN</option>
                            <option value="French">FR</option>
                        </select>
                    </div>
                </form>
            </div>
            <input type="checkbox" id="menu">
            <label for="menu" class="hamberger-menu">
                <div class="patty"></div>
            </label>
            <nav class="nav-holder">
                <a href="" class="active">Home</a>
                <a href="">Projects</a>
                <a href="">About</a>
                <a href="">People</a>
                <a href="">Contact</a>
            </nav>
        </div>
    </header>
    <section class="carousel-container">
        <div class="carousel-holder">
            <div class="carousel">
                <div class="slider-count">
                    <div class="count active"><span>01</span>/03</div>
                    <div class="count"><span>02</span>/03</div>
                    <div class="count"><span>03</span>/03</div>
                </div>
                <div class="slider">
                    <div class="slide active" id="slide-1">
                        <figure class="slide-image">
                            <img src="images/pexels-aleksandar-pasaric-325185.jpg" alt="slider-1">
                        </figure>
                        <div class="slider-text">Lego House</div>
                        <div class="slider-content">
                            <div class="slider-date">13/11/1992</div>
                            <article class="slider-description">
                                <p>
                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
                                    incididunt ut labore et dolore magna aliqua.
                                    <a href="" class="more">More</a>
                                </p>
                                <p>
                                    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
                                    ex ea commodo consequat.
                                    Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
                                    doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore
                                    veritatis et quasi architecto beatae vitae dicta sunt explicabo.
                                </p>
                                <p>
                                    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
                                    fugiat nulla pariatur. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut
                                    odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi
                                    nesciunt.
                                </p>
                                <p>
                                    MIES VAN DER ROHE AWARD
                                </p>
                            </article>
                        </div>
                    </div>
                    <div class="slide" id="slide-2">
                        <figure class="slide-image">
                            <img src="images/pexels-essow-936722.jpg" alt="slider-2">
                        </figure>
                        <div class="slider-text">Lego House</div>
                        <div class="slider-content">
                            <div class="slider-date">13/11/1992</div>
                            <article class="slider-description">
                                <p>
                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
                                    incididunt ut labore et dolore magna aliqua.
                                    <a href="" class="more">More</a>
                                </p>
                                <p>
                                    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
                                    ex ea commodo consequat.
                                    Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
                                    doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore
                                    veritatis et quasi architecto beatae vitae dicta sunt explicabo.
                                </p>
                                <p>
                                    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
                                    fugiat nulla pariatur. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut
                                    odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi
                                    nesciunt.
                                </p>
                                <p>
                                    MIES VAN DER ROHE AWARD
                                </p>
                            </article>
                        </div>
                    </div>
                    <div class="slide" id="slide-3">
                        <figure class="slide-image">
                            <img src="images/pexels-pixabay-534219.jpg" alt="slider-3">
                        </figure>
                        <div class="slider-text">Lego House</div>
                        <div class="slider-content">
                            <div class="slider-date">13/11/1992</div>
                            <article class="slider-description">
                                <p>
                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
                                    incididunt ut labore et dolore magna aliqua.
                                    <a href="" class="more">More</a>
                                </p>
                                <p>
                                    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
                                    ex ea commodo consequat.
                                    Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
                                    doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore
                                    veritatis et quasi architecto beatae vitae dicta sunt explicabo.
                                </p>
                                <p>
                                    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
                                    fugiat nulla pariatur. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut
                                    odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi
                                    nesciunt.
                                </p>
                                <p>
                                    MIES VAN DER ROHE AWARD
                                </p>
                            </article>
                        </div>
                    </div>
                </div>
                <div class="slider-control">
                    <button class="previous">&#x2039;</button>
                    <button class="next">&#x203A;</button>
                </div>
            </div>
        </div>
    </section>
    <main>
        <section class="news-container">
            <div class="news-holder">
                <div class="section-side-text">Recent News</div>
                <div class="primary-news">
                    <figure class="primary-news-image">
                        <img src="images/pexels-pixabay-534219.jpg" alt="news">
                    </figure>
                    <div class="primary-news-floting-text">
                        <div class="primary-news-date">18/10/2022</div>
                        <div class="primary-news-title">Quarters Renovation</div>
                    </div>
                    <article class="primary-news-description">
                        <p>
                            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
                            commodo consequat.Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
                            doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et
                            quasi architecto beatae vitae dicta sunt explicabo.
                        </p>
                        <a href="" class="more">More</a>
                    </article>
                </div>
                <div class="secondary-news">
                    <article class="secondary-news-description">
                        <div class="secondary-news-date">18/10/2022</div>
                        <h3>Ut enim ad minim veniam,nostrud</h3>
                        <p>
                            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
                            commodo consequat.Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
                            doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et
                            quasi architecto beatae vitae dicta sunt explicabo.
                        </p>
                        <p>
                            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
                            pariatur. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed
                            quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
                        </p>
                        <a href="" class="more">More</a>
                    </article>
                    <article class="secondary-news-description">
                        <div class="secondary-news-date">18/10/2022</div>
                        <h3>Ut enim ad minim veniam,nostrud</h3>
                        <figure class="secondary-news-image">
                            <img src="images/pexels-essow-936722.jpg" alt="">
                        </figure>
                        <p>
                            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
                            commodo consequat.Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
                            doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et
                            quasi architecto beatae vitae dicta sunt explicabo.
                        </p>
                        <a href="" class="more">More</a>
                    </article>
                </div>
            </div>
        </section>
        <section class="row-3-container">
            <div class="row-3">
                <div class="row-3-side-text">Competition</div>
                <article class="row-3-col-1">
                    <div class="date">31/10/1992</div>
                    <h3>Ut enim ad minim <br> veniam,nostrud</h3>
                    <p>
                        Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
                        pariatur. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
                        consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
                    </p>
                    <p>
                        Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium
                    </p>
                    <a href="" class="more">More</a>
                </article>
                <div class="row-3-col-2">
                    <figure class="row-3-image">
                        <img src="images/pexels-pixabay-534219.jpg" alt="">
                    </figure>
                    <div class="row-3-float-text">1<span>st</span> Prize</div>
                </div>
            </div>
        </section>
    </main>
    <footer>
        <div class="footer-holder">
            <address class="footer-col">
                <h3><span>skyscraper</span> Architecture</h3>
                <h4>Bangalore</h4>
                <p>Akshya Nagar 1st Block 1st Cross, Rammurthy nagar, Bangalore-560016</p>
                <p>Phone: +91 98765 43212</p>
                <p>Fax: 080 9876 5432</p>
            </address>
            <address class="footer-col">
                <h3><span>skyscraper</span> Architecture</h3>
                <h4>Mumbai</h4>
                <p>Opp Bassein Drugs, Waliv Rd, Nr Golani Complex, Vasai (east), Mumbai-401506</p>
                <p>Phone: +91 98765 43212</p>
                <p>Fax: 080 9876 5432</p>
            </address>
            <div class="footer-col quick-links">
                <h4>Shortcuts</h4>
                <a href="">Home</a>
                <a href="">Projects</a>
                <a href="">About</a>
                <a href="">People</a>
                <a href="">Contact</a>
            </div>
            <div class="footer-col">
                <div class="footer-side-text">Summery</div>
                <div class="newsletter">
                    <h4>Newsletter</h4>
                    <p>Subscribe our newsletter for getting notifications about our latest projects.</p>
                    <form action="" class="subscribe-form">
                        <input type="email" placeholder="Enter your E-mail ID">
                        <button>Subscribe</button>
                    </form>
                </div>
                <div class="social-media">
                    <a href="">
                        <figure>
                            <img src="images/facebook.png" alt="">
                        </figure>
                    </a>
                    <a href="">
                        <figure>
                            <img src="images/instagram.png" alt="">
                        </figure>
                    </a>
                    <a href="">
                        <figure>
                            <img src="images/linkedin.png" alt="">
                        </figure>
                    </a>
                    <a href="">
                        <figure>
                            <img src="images/twitter-sign.png" alt="">
                        </figure>
                    </a>
                </div>
            </div>
        </div>
    </footer>
</body>

</html>