Untitled

<!doctype html>
<head>
	<style>
	body{
		margin:0;}
	#navbar{
		border:1px solid black;
		width:100vw;
		height:10vh;
		background-color:red;
		color:white;}
	header{
		width:49vw;
		height:9vh;
		border:1px solid black;
		float:left;}
	nav{
		width:49vw;
		height:9vh;
		border:1px solid black;
		float:right;}
	li{
		display:inline-block;
		background-color:white;
		width:7vw;
		height:5vh;}
	section{
		float:left;
		width:70vw;
		height:80vh;
		border:1px solid black;}
	aside{
		float:right;
		width:28vw;
		height:80vh;
		border:1px solid black;}
	#tytul{
		height:10vh;
		width:100vh;
		background-color:blue;
		margin-left:10vw;
		margin-top:10vh;
		transition:2s ease-out;}
	#tytul:hover{
		transform:rotate(35deg);
		box-shadow: 0px 0px 50px 10px black;}
	.article{
		height:20vh;
		width:100vh;
		background-color:blue;
		margin-left:10vw;
		margin-top:5vh;
		transition:2s ease-out;}
	.article:hover{
		transform:rotate(35deg);
		box-shadow: 0px 0px 50px 10px black;}
	footer{
		height:7.5vh;
		width:100vw;
		background-color:red;}

	</style>
</head>
<body>
		<div id="navbar">
			<header>
				Tytułowy tytuu
			</header>
			<nav>
				<ul>
					<li>huj</li>
					<li>huj</li>
					<li>huj</li>
					<li>huj</li>
				</ul>
			</nav>
		</div>

		<div style="clear:both;"></div>

		<div id="czolem">
			<section>
				<div id="tytul">Aktualnosci</div>
				<div class="article"></div>
				<div class="article"></div>
			</section>
			<aside>
				asdasd
			</aside>
		</div>

		<div style="clear:both;"></div>

		<footer>
			sex ruchanie
		</footer>
</body>