смотри, у меня есть страница сайта, раздел услуги, я тебе скину щас основу и переделай ее типа как страницу предоставления услуг, обязательнон на странице должны быть три картинки в ряд с рамками а остальное просто информация об ослугах придумай сам
<!DOCTYPE html>
<html lang="ru">
<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Мой сайт</title> <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            background-color: #f4f4f4;
        }
        header {
            background-color: #333;
            color: white;   
            width: 100%;
            padding: 10px 20px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .logo {
            font-size: 24px;
            font-weight: bold;
        }
        nav {
            display: flex;
            gap: 20px;
        }
        nav a {
            color: white;
            text-decoration: none;
        }
        .container {
            width: 80%;
            display: flex;
            margin-top: 20px;
        }
        .sidebar {
            flex: 1;
            background-color: #fff;
            padding: 20px;
            border-right: 1px solid #ccc;
        }
        .content {
            flex: 3;
            padding: 20px;
            background-color: #fff;
        }
        .content img {
            width: 100px;
            border-radius: 50%;
        }
        footer {
            margin-top: 20px;
            text-align: center;
            width: 100%;
            padding: 10px;
            background-color: #333;
            color: white;
        }
    </style>
</head>
<body>
<header> <div class="logo"><img src="MireaGerb.png" alt="Изображение" width="50" height="50"></div> <nav> <a href="index.html">Главная</a> <a href="first-semester.html">Первый семестр</a> <a href="second-semester.html">Второй семестр</a> <a href="services.html">Услуги</a> <a href="login.html">Авторизация</a> </nav>
</header>
<div class="container"> <div class="sidebar"> <h2>Навигация по&nbsp;странице</h2> <ul> <li><a href="frontend.html">Фронтенд</a></li> <li><a href="backend.html">Бэкенд</a></li> </ul> </div> <div class="content"> <h1>Добро пожаловать на&nbsp;наш сайт</h1> <p>Нас зовут Стецко Антон и&nbsp;Хаустов Андрей и&nbsp;мы&nbsp;начинающие специалисты по&nbsp;<span style="white-space: nowrap;">веб-разработке</span>.</p> <h2>Фронтенд</h2> Фронтенд (или клиентская часть)&nbsp;&mdash; это то, что видит пользователь. Он&nbsp;включает в&nbsp;себя все визуальные элементы <span style="white-space: nowrap;">веб-сайта</span> или приложения: кнопки, формы, изображения и&nbsp;текст. Фронтенд разработчики используют языки разметки и&nbsp;стилизации, такие как <abbr title="HyperText Markup Language" lang="en"><abbr title="HyperText Markup Language" lang="en">HTML</abbr></abbr>, <abbr title="Cascading Style Sheets" lang="en"><abbr title="Cascading Style Sheets" lang="en">CSS</abbr></abbr> и&nbsp;JavaScript, чтобы создавать интерактивные и&nbsp;привлекательные интерфейсы. Основная задача фронтенда&nbsp;&mdash; обеспечить удобство использования и&nbsp;эстетическую привлекательность. <h2>Бэкенд</h2> <p>Бэкенд (или серверная часть)&nbsp;&mdash; это &laquo;за&nbsp;кулисами&raquo; <span style="white-space: nowrap;">веб-приложения</span>. Он&nbsp;отвечает за&nbsp;обработку данных, управление пользователями и&nbsp;взаимодействие с&nbsp;базами данных. Бэкенд разработчики используют языки программирования, такие как Python, Ruby, Java или <abbr title="Hypertext Preprocessor" lang="en"><abbr title="Hypertext Preprocessor" lang="en">PHP</abbr></abbr>, а&nbsp;также фреймворки и&nbsp;базы данных для создания логики приложения. Основная задача бэкенда&nbsp;&mdash; обеспечить стабильную работу приложения и&nbsp;безопасность данных.</p>  </div>
</div>
<footer> &copy; Хаустов Андрей и&nbsp;Стецко Антон, 2024
</footer>
</body>
</html>