Untitled

<!DOCTYPE HTML>
<html lang="pl">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta http-equiv="Content-Language" content="pl" />
  <meta name="description" content="Zadanie 2 / IAI WEBCAMP#4" />
  <meta name="keywords" content="Webcamp, IAI-Shop.com" />
  <title>Zadanie 2 / IAI WEBCAMP#4</title>
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&amp;subset=latin-ext" rel="stylesheet">
  <link href="css/font-awesome.css" rel="stylesheet">

  <style type="text/css">
    * {margin: 0; padding: 0; box-sizing: border-box;}
    body {background: #fff;  font-family: 'Open Sans', 'Arial', sans-serif; }

    header, section, .container {width: 980px; margin: 0 auto; position: relative;}
    article, footer {width: 100%;}
    img {max-width: 100%;}
    a {color: #333; text-decoration: none;}
	a:hover {color: #6cc8bf;}
    section {margin-bottom: 50px;}

    button {padding: 7px 15px; color: #fff; background: #6cc8bf; display: inline-block; border: none; cursor: pointer; font-family: 'Open Sans','Arial', sans-serif; font-size: 0.93em;}
    button:hover {color: #fff; background: #262626;}
    input {display: inline-block; padding: 7px 15px; vertical-align: top;}

    input:focus {outline: 0;}

    header {padding: 30px 0 0; margin-bottom: 0px;}
    header > div {display: inline-block; width: 33%; vertical-align: middle; text-align: center;}
    header > div:first-of-type {text-align: left; padding-left: 0px;}
    header > div:last-of-type {text-align: right; padding-top: 10px;}
    header > div input {width: 75%; border: none; border: 1px solid #fff; border-bottom: 1px solid #262626; height: 36px; transition: 0.3s all;}
    header > div input:focus {border: 1px solid #262626; transition: 0.3s all;}
    header > div > form {position: relative;}
    header > div > form > button {position: absolute; right: 25%; background: none; font-size: 1em; width: 36px; height: 36px; padding: 0; background: none; color: #6cc8bf;}
    header > div > form > button:hover {background: none; color: #262626;}
	header > div:last-of-type a {font-size: 0.85em; margin: 0 5px;}
	header > div > div {display: inline-block;}
	header > div > div a:hover {color: #6cc8bf;}
	header > div > div a i.fa {display: inline-block; margin-right: 5px; font-size: 1.5em;}

    nav {text-align: center; margin-top: 15px; background: #eee; padding: 10px; position: relative; z-index: 1; margin-bottom: 10px;}

  </style>

</head>
  <body>

  <header>
  	<div>
	  	<form>
	  		<input placeholder="Czego szukasz?"/><!--
	  		--><button type="submit"><i class="fa fa-search"></i></button>
	  	</form>
  	</div>

  	<div>
	  	<a href="/" tilte="IAI WEBCAMP#4 - Zadanie 1">
	  		<img src="img/ff_logo.png" alt="IAI WEBCAMP#4 - Zadanie 1" />
	  	</a>
  	</div>

  	<div>
  		<div>
	  		<a class="login" href="#toplayer" title="Zaloguj się">
		  		Logowanie
		  	</a>
		  	<span>|</span>
		  	<a class="contact" href="mailto:office@flavorfactory.pl" title="Zarejestruj się">
		  		Kontakt
		  	</a>
	  	</div>
	  	<div class="shopping_cart">
		  	<a href="/" title="Koszyk">
		  		<i class="fa fa-shopping-basket"></i>123,45 zł
		  	</a>
	  	</div>
  	</div>

    <nav>
    	miejsce na menu
    </nav>

  </header>

  </body>
</html>