* {padding:0;margin:0;}

html {width:100%;height:100%;}
body {font-family:Arial, Helvetica, Sans-serif;font-size:14px;line-height:1.5;font-weight:400;color:#FE0;background:#00C;}

.container {margin:0 auto;}

header {margin:25px 0;}
header h1 {float:right;margin:0 25px 25px;}

a{color:#FE0;}
a:visited, a:link, a:hover {text-decoration: none;}
a:hover {background:#212121;color:#FF0;}
a:focus {background:#212121;color:#FF0;}


poz {float:right;margin:0 0 25px;}
poz klawisze ul {list-style:none;}
poz klawisze ul li {margin:1px 1px 1px;float:left;width:130px;text-align: center;}
poz klawisze ul li a {display:block;text-decoration:none;color:#FE0;background:#30F;padding:8px 15px;}
poz klawisze ul li a:hover{background:#212121;color:#FE0;}

.menu-kolory {margin:2px 2px; text-align:right;}
.menu-trigger {color:#FE0;background:#30F;font-weight:700;text-transform:uppercase;padding:15px;margin:0 0 5px;}
.menu-trigger {display:block; text-align: center;}
.menu-trigger:hover {background:#212121;color:#FE0;}
.menu-trigger:focus {background:#212121;color:#FE0;}
button{
	font-size:14px;
	float: right;
	margin:0 0 0 4px;
	padding:2px;
}

.menu-aaaa {color:#FE0;background:#30F;font-weight:700;text-transform:uppercase;padding:15px;margin:0 0 5px;cursor:pointer;}
.menu-aaaa {display:block; text-align: center;}
.menu-aaaa:hover {background:#212121;color:#FE0;}
.menu-aaaa:focus {background:#212121;color:#FE0;}

aside {float:left;margin:0 0 25px;}

aside elektroniczna {display:none; width:100%;}
aside elektroniczna ul {list-style:none;}
aside elektroniczna ul li {margin-bottom:2px;}
aside elektroniczna ul li a {display:block;text-decoration:none;color:#FE0;background:#30F;padding:8px 20px;}
aside elektroniczna ul li a:hover{background:#212121;color:#FE0;}

aside fizyczna {display:none; width:100%;}
aside fizyczna ul {list-style:none;}
aside fizyczna ul li {margin-bottom:2px;}
aside fizyczna ul li a {display:block;text-decoration:none;color:#FE0;background:#30F;padding:8px 20px;}
aside fizyczna ul li a:hover{background:#212121;color:#FE0;}

#main {float:right;margin:0 25px 25px; text-align: left;}
#main ol li {margin-left:25px;}
#main ul li {margin-left:25px;}
#main a{font-weight:bold;}
#wide {float:right;margin:0 25px 25px; text-align: left;width:90%;}
#wide ol li {margin-left:25px;}
#wide ul li {margin-left:25px;}
#wide ul ul{margin-left:25px;}

footer {clear:both;color:#FE0;background:#30F;padding:15px 0 15px 30px;margin:0 0 25px;text-align: center;}
footer a{clear:both;color:#FE0;background:#30F;}

@media (min-width: 1100px) {
	.container {width:1050px;}
	header img {width:270px;}
	aside {width:250px;}
	#main {width:750px;}
	#wide {width:1000px;}
}
@media (max-width: 1100px) and (min-width: 801px) {
	.container {width:750px;}
	header img {width:200px;}
	aside {width:250px;}
	#main {width:450px;}
	#wide {width:700px;}
}
@media (max-width: 800px) and (min-width: 461px) {
	.container {width:90%;}
	header img {width:150px;}
	aside {width:100%;}
	#main {width:95%;}
	#wide {width:95%;}
	header h1 {font-size: 150%;}
}
@media (max-width: 460px) and (min-width: 331px) {
	.container {width:90%;}
	header img {display: block; margin-left: auto; margin-right: auto; width: 150px;}
	aside,
	#main {width:90%;}
	#wide {width:90%;}
	header h1 {font-size: 150%;}
}
@media (max-width: 330px) {
	.container {width:90%;}
    img {display: none;}
	aside,
	#main {width:85%;}
	#wide {width:85%;}
	header h1 {font-size: 150%;}
}