* {padding:0;margin:0;}

html {width:100%;height:100%;}
body {font-family:Arial, Helvetica, Sans-serif; font-size: large; line-height:1.5;font-weight:400;color:#fdf8f1;background:#2c333a;}
p {margin:5px 1px 5px 1px;}
a, a:visited  {font-weight: bold; color:#cbff97; text-decoration: none;}

a:hover, a:active {font-weight: bold; color:#ffff00; text-decoration: underline;}

.container {margin:0 auto;}

header {margin:10px 0;}
header img {width:100%;}

aside {float:left;margin:0 0 25px;}
aside nav ul {list-style:none;}
aside nav ul li {margin-bottom:1px;}
aside nav ul li a {display:block;text-decoration:none;color:#cbff97;background:#121212;padding:5px 20px;}
aside nav ul li a:hover{background:#004000;color:#ffff00;}

.kontener-tekst {
    font-size: 20px;       /* Tutaj ustawiasz rozmiar czcionki */
    font-family: Arial;    /* Możesz zmienić czcionkę na ładniejszą */
    white-space: pre-wrap; /* Zachowuje entery i spacje z pliku txt */
    border: 1px solid #ccc;
    padding: 15px;
		margin: 20px auto;
		width:85%;
		height: 200px;
    overflow-y: scroll;
  }
	
#main {float:right;margin:0 0 25px;}

footer {clear:both;color:#ffffff;background:#000000;padding:15px 0 15px 30px;margin:0 0 25px;}


@media (min-width: 1500px) {
	.container {width:1400px;}
	aside {width:30%;}
	#main {width:68%;}
}

@media (max-width: 1500px) and (min-width: 1300px) {
	.container {width:1250px;}
	aside {width:30%;}
	#main {width:68%;}
}

@media (max-width: 1300px) and (min-width: 1100px) {
	.container {width:1050px;}
	aside {width:30%;}
	#main {width:68%;}
}
@media (max-width: 1100px) and (min-width: 1000px) {
	.container {width:950px;}
	aside {width:30%;}
	#main {width:68%;}
}
@media (max-width: 1000px) and (min-width: 800px) {
	.container {width:750px;}
	aside {width:30%;}
	#main {width:68%;}
}
@media (max-width: 800px) and (min-width: 500px) {
	.container {width:450px;}
	aside,
	#main {width:100%;}
}
@media (max-width: 500px) {
	.container {width:90%;}
	aside,
	#main {width:100%;}
}