li {
	color: rgb(70, 132, 200);
	font-family: consolas;
	font-size: 14 px;
}

h1 {
	color: #1514b9;
	font-size: 24px; 
}

p {
	font-family: sans-serif;
	font-size: 14px;
	text-align: left;
	text-indent: 64pt;
}

a {
	font-size: 16px;
	color: blue
}
	
a: hover {
	color: red;
	text-decoration: underline;
}

img {
	max-width: 200 px;
	height: auto;
}

.nazaj {
	background-color: black;
	border: 5px solid yellow;
	color: white;
	font-family: inconsolata;
}

.navi {
	list-style: none;
	padding: 10px;
	margin: 15 px;
	display: flex;
	gap: 30px;
	background-color: #fd64ea;
}

.navi li {
	background-color: lightgreen;
	padding: 10px;
	margin: 15 px;
}

.navi li a {
	text-decoration: none;
	font-family: arial;
}

.active {
    color: indianred;
    background-color: yellow;
    text-decoration: underline;
}

@media (max-width: 1200 px): {
	navi li a {
		max-width: 100%;
		height: auto;
		display: block;
		margin: 5px 10px;
	img {
		max-width: 100%;
		height: auto;
		margin: 5px 10px
	}	
}

@media (max-width: 600px) {
    nav { display: flex; flex-direction: column; } 
    nav a { margin: 5px 0; text-align: center; }   
    h1 { font-size: 24px; }                        
    img { width: 90%; height: auto; }             
    p { font-size: 14px; }                        
    footer { padding: 15px; }                     
}

@media (max-width: 1024px) {
    body { font-size: 18px; }                     
    nav a { padding: 15px; }                      
    img { max-width: 80%; }                       
    header { padding: 25px; } 
}