<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Времена года</title>
<style>
body{font-family:sans-serif;margin:0;padding:20px;}
header{display:flex;align-items:flex-start;gap:40px;margin-bottom:20px;}
.logo img{width:100px;height:auto;}
.section{height:300px;padding:20px;border:1px solid #ccc;}
#summer{background-color:rgb(229,179,179);}
#autumn{background-color:rgb(179,229,179);}
#winter{background-color:rgb(179,179,229);}
#spring{background-color:rgb(179,217,217);}
ul{list-style-type:none;padding:0;}
a{text-decoration:none;color:blue;}
.pizza-img{width:150px;height:auto;margin-top:10px;}
</style>
</head>
<body>
<header>
<div class="logo">
<a href="index.html">
<img src="https://via.placeholder.com/100" alt="Логотип">
</a>
</div>
<div class="content">
<h1>Времена года</h1>
<h3>Оглавление:</h3>
<ul>
<li><a href="#summer">Лето</a></li>
<li><a href="#autumn">Осень</a></li>
<li><a href="#winter">Зима</a></li>
<li><a href="#spring">Весна</a></li>
</ul>
</div>
</header>
<!-- Добавленное фото Pizza.png -->
<div>
<img src="Pizza.png" alt="Пицца" class="pizza-img">
</div>
<div id="summer" class="section" style="background-color: pink;"><h2>Лето (розовый)</h2></div>
<div id="autumn" class="section" style="background-color: lightgreen;"><h2>Осень (зелёный)</h2></div>
<div id="winter" class="section" style="background-color: lavender;"><h2>Зима (сиреневый)</h2></div>
<div id="spring" class="section" style="background-color: lightblue;"><h2>Весна (голубой)</h2></div>
</body>
</html>
