vika101-65
/
hw-yevgen
geforkt von Yevhen/hw


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
							<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>HW5_Chukharkin_Yevhen</title>
	<link media="all" rel="stylesheet" href="css/reset.css">
	<link media="all" rel="stylesheet" href="css/style.css">
	<!-- TASK 1: SPENT 2 HOUR
	TASK 2: SPENT 2 HOUR
	TASK 3: SPENT 20 MIN -->
	
</head>
<body>

	
		<header class="header">
			<strong class="header_left"><a href="#"><img src="media/images/ico_float.png" alt="A-level Ukraine"></a></strong>
			<div class="header_right">
				<ul class="header_right_menu">
					<li><a href="#">Item1</a></li>
					<li><a href="#">Item2</a></li>
					<li><a href="#">Item3</a></li>
					<li><a href="#">Item4</a></li>
					<li><a href="#">Item5</a></li>
				</ul>
			</div>     
        </header>


        <main class="main">
            <section class="main_section">
                <h1>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, voluptatum delectus facere. Quisquam laboriosam error quaerat laborum quia delectus doloremque, voluptatum accusamus dolorem id expedita pariatur iusto harum minima alias.</h1>
                <article class="main_section_product">
                	<h2>our work</h2>
                	<ul class="main_section_product_list">
                		<li class="main_section_product_list_item">
                			<div class="main_section_product_list_item_wrap">
                             <img src="media/images/football_item1.png" alt="icon">
                            <h2>Lorem ipsum dolor sit.</h2>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perspiciatis ut debitis id quaerat numquam, dignissimos voluptas laboriosam. Quos, enim nesciunt!</p>            
                            </div>
                			<a href="#">Go</a>
                		</li>
                        <li class="main_section_product_list_item">
                            <div class="main_section_product_list_item_wrap">
                             <img src="media/images/runner_item2.png" alt="icon">
                            <h2>Lorem ipsum dolor sit.</h2>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing </p>    
                            </div>
                            <a href="#">Go</a>
                        </li>
                        <li class="main_section_product_list_item">
                            <div class="main_section_product_list_item_wrap">
                             <img src="media/images/artistic_item3.png" alt="icon">
                            <h2>Lorem ipsum dolor sit.</h2>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perspiciatis ut debitis id</p>
                            </div>
                            <a href="#">Go</a>
                        </li>
                        <li class="main_section_product_list_item">
                            <div class="main_section_product_list_item_wrap">
                             <img src="media/images/volleyball_item4.png" alt="icon">
                            <h2>Lorem ipsum dolor sit.</h2>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perspiciatis ut debitis id quaerat numquam, dignissimos voluptas laboriosam. Quos, enim nesciunt!</p>            
                            </div>
                            <a href="#">Go</a>
                        </li>
                        <li class="main_section_product_list_item">
                            <div class="main_section_product_list_item_wrap">
                             <img src="media/images/tennis_item5.png" alt="icon">
                            <h2>Lorem ipsum dolor sit.</h2>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perspiciatis ut debitis id quaerat numquam, dignissimos voluptas laboriosam. Quos, enim nesciunt!</p>            
                            </div>
                            <a href="#">Go</a>
                        </li>
                	</ul>
                </article>


				<div class="main_section_holder">
					<div class="main_section_item">1</div>
					<div class="main_section_item">2</div>
					<div class="main_section_item">3</div>
					<div class="main_section_item">4</div>
					<div class="main_section_item">5</div>
				</div>


            </section>
            <aside class="main_aside main_aside-left">
                <p>Aside1</p>
            </aside>
            <aside class="main_aside main_aside-right">
                <p>Aside2</p>
            </aside>
        </main>


        <footer class="footer">
            <div class="footer_content">Footer</div>
        </footer>


</body>
</html>