|
@@ -0,0 +1,91 @@
|
|
|
|
+<!DOCTYPE HTML>
|
|
|
|
+<html lang="ru">
|
|
|
|
+ <head>
|
|
|
|
+ <meta charset="UTF-8">
|
|
|
|
+ <link media="all" rel="stylesheet" href="css/style2.css">
|
|
|
|
+ <link media="all" rel="stylesheet" href="reset/reset.css">
|
|
|
|
+ <link media="all" rel="icon" href="https://png.pngtree.com/png-clipart/20190516/original/pngtree-digital-human-brain-vector-logo-future-electronic-structure-technology-creative-png-image_3628398.jpg">
|
|
|
|
+ <title>Homework5</title>
|
|
|
|
+
|
|
|
|
+ </head>
|
|
|
|
+ <body>
|
|
|
|
+ <div class="wrapper">
|
|
|
|
+ <header class="header">
|
|
|
|
+ <div class="logotype">
|
|
|
|
+ <img class="logo" src="https://robymgood.com/uploads/media/company_logo/0001/01/thumb_59_company_logo_big.png" alt="">
|
|
|
|
+ </div>
|
|
|
|
+ <nav>
|
|
|
|
+ <ul>
|
|
|
|
+ <li><a href="#">About us</a></li>
|
|
|
|
+ <li><a href="#">Our</a></li>
|
|
|
|
+ <li><a href="#">Blog</a></li>
|
|
|
|
+ <li><a href="#">Shop</a></li>
|
|
|
|
+ <li><a href="#">Contact us</a></li>
|
|
|
|
+ </ul>
|
|
|
|
+ </nav>
|
|
|
|
+ </header>
|
|
|
|
+ <main class="main">
|
|
|
|
+ <div class="column2">
|
|
|
|
+ <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, aliquam. Voluptatem tenetur natus nihil ea animi, error sequi illum pariatur exercitationem porro ullam numquam? Tempora dolore doloremque ratione hic iusto?
|
|
|
|
+ </p>
|
|
|
|
+ <h1>OUR WORK</h1>
|
|
|
|
+ <div class="cards">
|
|
|
|
+ <div class="card1">
|
|
|
|
+ <div class="box1">
|
|
|
|
+ <img class="foto1" src="images/nature.jpeg" alt="">
|
|
|
|
+ </div>
|
|
|
|
+ <h1>Lorem ipsum dolor sit amet</h1>
|
|
|
|
+ <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque molestiae commodi quos, asperiores assumenda repellat.</p>
|
|
|
|
+ <button class="button1"><p>Go</p></button>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="card2">
|
|
|
|
+ <div class="box1">
|
|
|
|
+ <img class="foto1" src="images/nature.jpeg" alt="">
|
|
|
|
+ </div>
|
|
|
|
+ <h1>Lorem ipsum dolor sit amet</h1>
|
|
|
|
+ <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque molestiae commodi quos, asperiores assumenda repellat.</p>
|
|
|
|
+ <button class="button1"><p>Go</p></button>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="card3">
|
|
|
|
+ <div class="box1">
|
|
|
|
+ <img class="foto1" src="images/nature.jpeg" alt="">
|
|
|
|
+ </div>
|
|
|
|
+ <h1>Lorem ipsum dolor sit amet</h1>
|
|
|
|
+ <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque molestiae commodi quos, asperiores assumenda repellat.</p>
|
|
|
|
+ <button class="button1"><p>Go</p></button>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="card4">
|
|
|
|
+ <div class="box1">
|
|
|
|
+ <img class="foto1" src="images/nature.jpeg" alt="">
|
|
|
|
+ </div>
|
|
|
|
+ <h1>Lorem ipsum dolor sit amet</h1>
|
|
|
|
+ <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque molestiae commodi quos, asperiores assumenda repellat.</p>
|
|
|
|
+ <button class="button1"><p>Go</p></button>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="card5">
|
|
|
|
+ <div class="box1">
|
|
|
|
+ <img class="foto1" src="images/nature.jpeg" alt="">
|
|
|
|
+ </div>
|
|
|
|
+ <h1>Lorem ipsum dolor sit amet</h1>
|
|
|
|
+ <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque molestiae commodi quos, asperiores assumenda repellat.</p>
|
|
|
|
+ <button class="button1"><p>Go</p></button>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="card6">
|
|
|
|
+ <div class="box1">
|
|
|
|
+ <img class="foto1" src="images/nature.jpeg" alt="">
|
|
|
|
+ </div>
|
|
|
|
+ <h1>Lorem ipsum dolor sit amet</h1>
|
|
|
|
+ <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Eaque molestiae commodi quos, asperiores assumenda repellat.</p>
|
|
|
|
+ <button class="button1"><p>Go</p></button>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="column1">Aside 1</div>
|
|
|
|
+ <div class="column3">Aside 2</div>
|
|
|
|
+ </main>
|
|
|
|
+ <footer class="footer">
|
|
|
|
+ <div class="down">Footer</div>
|
|
|
|
+ </footer>
|
|
|
|
+ </div>
|
|
|
|
+ </body>
|
|
|
|
+</html>
|