/
devigor
/
FirstProject
Обзор
Документация
Войти
/
devigor
/
FirstProject
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
index.html
498 строк
227 KB
devigor
upload files
17 ноя 2025, 08:24
17 ноя 2025, 08:24
0bab7d6
Код
Авторство
О чём код?
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Название сайта</title> <!-- ~ Подключение основного файла стилей --> <link rel="stylesheet" href="css/style.css"> </head> <body> <!-- & контейнер для всего сайта --> <div class="site-container"> <!-- & шапка сайта начало --> <!-- header: Блок, представляющий заголовок. --> <header class="header"> <!-- header__container: Элемент, который содержит логотип и навигацию. --> <div class="header__container container flex"> <!-- header__logo: Элемент для логотипа. --> <a class="header__logo" href="#"> <!-- header__logo-image: Элемент для изображения логотипа. --> <img src="images/Logo.png" alt="Логотип сайта" class="header__logo-image"> </a> <button class="header__button-menu btn-reset btn">Menu</button> <!-- header__navigation: Элемент, содержащий навигацию и кнопку. --> <div class="header__navigation flex"> <!-- nav: Блок, представляющий навигацию. --> <nav class="nav"> <!-- nav__list: Элемент списка навигации. --> <ul class="nav__list flex"> <!-- nav__item: Элемент списка (каждый пункт меню). --> <li class="nav__item"> <!-- nav__link: Элемент ссылки (каждая ссылка в пункте меню). --> <a class="nav__link" href="#">Projects</a> </li> <li class="nav__item"> <a class="nav__link" href="#">About</a> </li> <li class="nav__item"> <a class="nav__link" href="#">News</a> </li> <li class="nav__item"> <a class="nav__link" href="#">Team</a> </li> <li class="nav__item"> <a class="nav__link" href="#">Contact</a> </li> </ul> </nav> <!-- header__button: Элемент кнопки. --> <a href="#" class="header__button btn-reset btn">Get template</a> </div> </div> </header> <!-- & шапка сайта конец --> <!-- & начало контента --> <main> <article> <!-- & первая секция начало--> <!-- section-intro: Блок, представляющий секцию на странице. --> <section class="section-intro"> <!-- section-intro__container: Элемент, который содержит весь контент секции. --> <div class="section-intro__container flex"> <!-- section-intro__content: Элемент, содержащий текстовый контент. --> <div class="section-intro__content"> <!-- section-intro__link: Элемент ссылки (используется для ссылок внутри секции). section-intro__link--brand: Модификатор для ссылки на бренд (можно использовать для стилизации).--> <a href="#" class="section-intro__link section-intro__link--brand">Wishbone+Partners</a> <!-- section-intro__title: Элемент заголовка секции. --> <h1 class="section-intro__title">The home of beautiful architecture.</h1> <!-- section-intro__description: Элемент описания секции. --> <p class="section-intro__description"> We are an architecture firm with a focus on beautiful but functional design. At its heart, we believe design is about usability and accessibility — these are the guiding principles for our work. Read more about our previous projects, our process and our team below. </p> <!-- section__link--read-more: Модификатор для ссылки "Read more". --> <a href="#" class="section-intro__link section__link--read-more">Read more</a> </div> <!-- section-intro__image-container: Элемент, предназначенный для изображения (если оно будет добавлено). --> <div class="section-intro__image-container"></div> </div> </section> <!-- & первая секция конец --> <!-- & вторая секция начало --> <!-- firm: Блок, представляющий информацию о фирме. --> <section class="firm"> <!-- firm__container: Элемент-контейнер для размещения содержимого блока. --> <div class="firm__container flex"> <!-- firm__header: Элемент заголовка блока. --> <div class="firm__header"> <!-- firm__title: Элемент заголовка (h2). --> <h2 class="firm__title">Our firm</h2> </div> <!-- firm__content: Элемент, содержащий основной текст и описание. --> <div class="firm__content"> <!-- firm__description: Элемент абзаца с описанием фирмы. --> <p class="firm__description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.</p> <p class="firm__description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.</p> <p class="firm__description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.</p> <!-- firm__avatar: Элемент для размещения аватара и информации о сотруднике. --> <div class="firm__avatar flex"> <!-- firm__avatar-image: Элемент изображения аватара. --> <img src="images/firm-avatar.jpg" alt="Аватар Stephen Collier" class="firm__avatar-image"> <!-- firm__avatar-info: Элемент для информации об аватаре (имя и должность). --> <div class="firm__avatar-info"> <!-- firm__avatar-name: Элемент с именем сотрудника. --> <p class="firm__avatar-name">Stephen Collier</p> <!-- firm__avatar-position: Элемент с должностью сотрудника. --> <span class="firm__avatar-position">Senior Partner</span> </div> </div> </div> </div> </section> <!-- & вторая секция конец --> <!-- & третья секция начало --> <!-- section-template блок section-one первая секция--> <section class="section-template section-one"> <!-- section-template__background Элемент для фона, который содержит изображение. --> <div class="section-template__background flex"> <!-- section-template__content Элемент-контейнер для размещения заголовка и описания. --> <div class="section-template__content flex"> <!-- section-template__title Элемент заголовка (h3) блока. --> <h3 class="section-template__title">The marble staircase</h3> <!-- section-template__description Элемент абзаца с описанием. --> <p class="section-template__description">Lorem ipsum dolor sit amet, dolor sit amet dolor sit amet.</p> </div> </div> </section> <!-- & третья секция конец --> <!-- & четвертая секция начало --> <!-- Краткое пояснение классов: - process — родительский блок всей секции процесса. - process__container, process__content, process__header, process__title-small, process__title-big, process__steps — дочерние элементы блока .process. Каждый элемент получает префикс своего родителя (process) + двойное подчеркивание (__), чтобы обозначить связь с родителем. - step — общий класс для каждого шага (эскизы, финализация, строительство). - step--sketching, step--finalizing, step--building — модификации класса step, --> <!-- process — родительский блок всей секции процесса. --> <section class="process"> <div class="process__container container"> <div class="process__content content flex"> <div class="process__header"> <h3 class="process__title-small">Our process</h3> <h2 class="process__title-big">How we do what we do.</h2> </div> <div class="process__steps flex"> <div class="step step--sketching flex"> <div class="step__image"> <svg width="117" height="102" viewBox="0 0 117 102" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M58.5 0C90.8087 0 117 22.8335 117 51C117 79.1665 90.8087 102 58.5 102C26.1913 102 0 79.1665 0 51C0 22.8335 26.1913 0 58.5 0ZM60.1012 41.6732L49.8425 42.666C47.5648 51.2711 45.8528 56.4007 41.2941 61.0347L43.5429 62.9922C48.9124 57.7643 50.5196 51.7654 52.441 45.2385L58.918 44.6123L65.8448 50.6462L65.1258 56.2883C57.6333 57.9622 50.7452 59.3622 44.7454 64.0397L46.9941 66C52.3121 62.0289 58.2023 60.5389 68.0806 58.5533L69.2203 49.6169L60.1012 41.6732ZM57.8219 51.6011C57.0124 50.871 55.8137 50.5782 54.6865 50.8352C53.5593 51.0922 52.679 51.859 52.384 52.8409C52.0889 53.8229 52.4251 54.8671 53.2632 55.5723C54.5326 56.6211 56.529 56.5985 57.7651 55.5214C59.0012 54.4442 59.0264 52.7051 57.8219 51.6011ZM64.0909 37.205C63.875 37.0173 63.5559 36.952 63.2666 37.0361C62.9773 37.1202 62.7673 37.3394 62.724 37.6024L62.3822 39.6876L71.4996 47.6299L73.8757 47.307C74.176 47.2666 74.4247 47.0826 74.519 46.8311C74.6133 46.5795 74.5372 46.3032 74.3223 46.1162L64.0909 37.205Z" fill="#403E3B" /> </svg> </div> <h4 class="step__heading">Sketching</h4> <p class="step__description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ut tristique libero. Nulla luctus sapien ac arcu tempor, vitae tempor leo iaculis.</p> </div> <div class="step step--finalizing flex"> <div class="step__image"> <svg width="117" height="102" viewBox="0 0 117 102" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M58.5 0C90.8087 0 117 22.8335 117 51C117 79.1665 90.8087 102 58.5 102C26.1913 102 0 79.1665 0 51C0 22.8335 26.1913 0 58.5 0ZM51.1078 37L44.7353 44V65H57.4804V44L51.1078 37ZM71.8186 39.8H62.2598C61.3799 39.8 60.6667 40.4268 60.6667 41.2V63.6C60.6667 64.3732 61.3799 65 62.2598 65H71.8186C72.6985 65 73.4118 64.3732 73.4118 63.6V59.4H70.2255V56.6H73.4118V53.8H68.6323V51H73.4118V48.2H70.2255V45.4H73.4118V41.2C73.4118 40.4268 72.6985 39.8 71.8186 39.8ZM54.2941 59.4V62.2H47.9216V59.4H54.2941Z" fill="#403E3B" /> </svg> </div> <h4 class="step__heading">Finalizing</h4> <p class="step__description">Adipiscing elit. Nulla ut tristique libero. Nulla vitae tempor leo iaculis luctus sapien ac arcu tempor, vitae.</p> </div> <div class="step step--building flex"> <div class="step__image"> <svg width="117" height="102" viewBox="0 0 117 102" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M58.5 0C90.8087 0 117 22.8335 117 51C117 79.1665 90.8087 102 58.5 102C26.1913 102 0 79.1665 0 51C0 22.8335 26.1913 0 58.5 0ZM60.9222 39.1052C60.7411 38.9964 60.5095 38.9702 60.3017 39.035L47.1914 43.1222C46.6557 43.2894 46.2993 43.726 46.2995 44.2148V59.6752H43.5882V62H73.4118V59.6752H70.7005V48.8889C70.7007 48.3884 70.3271 47.9439 69.7733 47.7858L61.2112 45.3389V39.5814C61.2113 39.3918 61.1034 39.214 60.9222 39.1052ZM58.5 42.0702V59.6752H49.0107V45.0297L58.5 42.0702ZM61.2112 47.7893L67.9893 49.7271V59.6752H61.2112V47.7893Z" fill="#403E3B" /> </svg> </div> <h4 class="step__heading">Building</h4> <p class="step__description">Nulla ut tristique libero. Lorem ipsum ut tristique libero. Nulla luctus sapien ac arcu tempor, vitae lorem ipsum dolor leo iaculis.</p> </div> </div> </div> </div> </section> <!-- & четвертая секция конец --> <!-- & пятая секция начало --> <!-- section-template блок section-one первая секция--> <section class="section-template section-two"> <!-- section-template__background Элемент для фона, который содержит изображение. --> <div class="section-template__background flex"> <!-- section-template__content Элемент-контейнер для размещения заголовка и описания. --> <div class="section-template__content flex"> <!-- section-template__title Элемент заголовка (h3) блока. --> <h3 class="section-template__title">The marble staircase</h3> <!-- section-template__description Элемент абзаца с описанием. --> <p class="section-template__description">Lorem ipsum dolor sit amet, dolor sit amet dolor sit amet.</p> </div> </div> </section> <!-- & пятая секция конец --> <!-- & шестая секция начало --> <!-- clients: основной блок секций клиентов. --> <section class="clients"> <!-- - clients__container: контейнер секции клиентов. --> <div class="clients__container container"> <!-- - clients__content: основное содержание блока. --> <div class="clients__content content flex"> <!-- - info: блок с заголовком и описанием. --> <div class="clients__info info"> <!-- - info__title: заголовок H3. --> <h3 class="info__title">Prior Clients</h3> <!-- - info__subtitle: заголовок H2. --> <h2 class="info__subtitle">Happy Customers</h2> <!-- - info__description: абзац текста. --> <p class="info__description">Morbi neque ex, condimentum dapibus congue et, vulputate ut ligula. Vestibulum sit amet urna turpis. Mauris euismod elit et nisi ultrices, ut faucibus orci tincidunt.</p> </div> <!-- - logos: область логотипов. --> <div class="clients__logos logos flex"> <!-- - logos__row: строка логотипов. --> <div class="logos__row row flex"> <!-- - row__logo: элемент логотипа. --> <!-- - logo: класс самого изображения логотипа. --> <div class="row__logo logo"> <svg width="128" height="30" viewBox="0 0 128 30" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M95.5889 12.6817C95.7328 12.6817 95.7328 12.6995 95.8762 12.6995C95.9822 12.6995 96.0711 12.7112 96.1442 12.7451C96.2304 12.7852 96.3029 12.8447 96.3419 12.9331C96.3754 13.0071 96.3946 … [Строка слишком длинная. Вы можете скачать файл] fill="white" /> </svg> </div> <div class="row__logo logo"> <svg width="128" height="78" viewBox="0 0 128 78" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M36.6457 63.4436C37.095 63.4436 37.5215 63.5025 37.9271 63.6223C38.3345 63.7402 38.7305 63.9113 39.1171 64.1357V66.8488C38.8315 66.5998 38.5173 66.3887 38.1803 66.2119C37.8452 66.037 37 … [Строка слишком длинная. Вы можете скачать файл] fill="white" /> </svg> </div> </div> <div class="logos__row row flex"> <div class="row__logo logo flex"> <svg width="128" height="20" viewBox="0 0 128 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M6.86119 0C9.98996 0 12.5143 1.69561 12.5143 4.41416C12.5143 6.27171 11.4714 7.64417 11.0605 7.64417C10.6765 7.64417 8.7005 6.46003 8.7005 6.1105C8.7005 5.97567 9.0845 5.35649 9.0845 4.7373C9.0845 3.60665 8.28811 2.79915 6.91647 2.79915C5.57173 2.79915 4.61098 3.68726 4.61098 5.00623C4.61098 6.40654 6.14773 7.24115 8.1514 8.23697C8.30841 8.31624 8.46593 8.39574 8.62342 8.47576L9.09527 8.71755C11.6056 10.0179 13.9697 11.5119 13.9697 14.2398C13.9697 17.7123 10.8954 20 6.80665 20C2.79931 20 0 18.0347 0 14.5087C0 12.2474 1.42767 10.4975 1.75639 10.4975C2.19567 10.4975 4.08952 11.7901 4.08952 12.1397C4.08952 12.3551 3.43059 13.0549 3.43059 14.2398C3.43059 15.9896 4.9128 17.1737 6.91647 17.1737C9.00157 17.1737 10.3194 15.9625 10.3194 14.3204C10.3194 12.7588 8.94704 11.8707 5.92808 10.4441C3.29388 9.20569 1.04292 7.88671 1.04292 4.92562C1.04292 2.15359 3.48588 0 6.86119 0ZM93.3374 0C96.6313 0 98.7171 2.20708 98.7171 5.06045C98.7171 7.88671 96.5491 10.0667 93.7498 10.8207C93.5847 10.8749 93.3651 10.902 93.2283 10.902C92.8712 10.902 92.0203 8.77482 92.0203 8.42529C92.0203 8.31758 92.1025 8.23697 92.2399 8.18275C94.1607 7.42874 95.3411 6.43365 95.3411 4.92562C95.3411 3.76859 94.6276 2.93398 93.2829 2.93398C90.4836 2.93398 88.453 6.56774 88.453 10.4712C88.453 14.4545 91.0872 17.066 94.6276 17.066C97.1873 17.066 99.1552 15.7886 100.213 14.0711C100.185 13.7939 100.171 13.509 100.171 13.2168C100.171 9.44816 102.642 6.62116 106.045 6.62116C107.773 6.62116 108.981 7.24108 109.832 7.99436L109.915 7.96725V7.61772C109.915 7.21397 110.189 6.97142 110.546 6.97142H112.659C113.07 6.97142 113.318 7.21397 113.318 7.67121C113.318 8.18268 113.016 12.0861 113.016 14.2126C113.016 15.4238 113.51 16.4197 114.47 16.4197C115.812 16.4197 116.952 14.7629 117.6 13.2742L117.599 7.64439C117.599 7.24064 117.818 6.97172 118.23 6.97172H120.426C120.865 6.97172 121.112 7.21426 121.112 7.6715C121.112 9.17879 120.974 13.0551 120.974 14.078C120.974 15.4505 121.441 16.4199 122.566 16.4199C124.076 16.4199 125.366 14.4818 125.86 13.1093C125.915 12.9745 125.969 12.8939 126.134 12.8939C126.381 12.8939 128 13.6201 128 13.9168C128 13.9974 127.973 14.1052 127.945 14.1858C127.177 16.5005 125.146 19.3539 121.798 19.3539C119.978 19.3539 118.684 18.5865 118.048 17.1722C117.022 18.3649 115.543 19.3536 113.565 19.3536C111.589 19.3536 110.161 18.4384 110.161 16.8776V16.608L110.052 16.5816C109.365 18.0618 107.829 19.3536 105.441 19.3536C103.559 19.3536 102.061 18.4793 101.15 17.0139C99.6515 18.7048 97.269 20 94.1607 20C88.5897 20 84.8028 16.2585 84.8028 10.5247C84.8028 4.71019 88.2602 0 93.3374 0ZM54.6144 0.564886C55.0805 0.564886 55.3002 0.83381 55.3002 1.29179C55.3002 3.06873 54.9438 11.4398 54.9438 14.2397C54.9438 15.4773 55.3824 16.4197 56.4806 16.4197C57.8926 16.4197 59.0813 14.5857 59.6645 13.2717L59.6636 7.64439C59.6636 7.24064 59.8832 6.97172 60.2949 6.97172H62.4905C62.9298 6.97172 63.1763 7.21426 63.1763 7.6715C63.1763 9.17879 63.0396 13.0551 63.0396 14.078C63.0396 15.4505 63.5058 16.4199 64.6309 16.4199C65.7994 16.4199 66.8359 15.2591 67.4741 14.0981C67.427 13.7699 67.4035 13.4304 67.4035 13.0822C67.4035 9.36711 70.1475 6.62146 74.237 6.62146C78.1614 6.62146 80.7135 9.36711 80.7135 12.8668C80.7135 16.0704 78.408 19.3539 73.8523 19.3539C71.5176 19.3539 69.6785 18.4108 68.5715 16.8873C67.4969 18.2651 65.9314 19.3539 63.8629 19.3539C62.0474 19.3539 60.755 18.5901 60.1166 17.182C59.0428 18.411 57.5322 19.3536 55.6565 19.3536C53.3787 19.3536 51.7874 18.3043 51.7874 16.6893V16.4739L51.6776 16.4468C50.9918 17.8735 49.4819 19.3536 47.1219 19.3536C45.2177 19.3536 43.7354 18.4898 42.8238 17.0689C41.7516 18.3667 40.2182 19.3541 38.2297 19.3541C36.0064 19.3541 34.6347 18.1963 34.6347 16.6084C34.6347 16.4736 34.6347 16.2582 34.6616 16.1775L34.5518 16.1504C33.8114 17.7391 32.274 19.3541 29.8041 19.3541C28.0343 19.3541 26.8215 18.54 26.2162 17.1566C25.1331 18.3873 23.5472 19.3539 21.3519 19.3539C18.3599 19.3539 16.3293 17.4158 16.3293 14.5089V9.69026H15.6159C15.2042 9.69026 15.0122 9.55543 15.0122 9.15168V7.64439C15.0122 7.34835 15.1489 7.13292 15.506 7.13292H16.3293V4.06412C16.3293 3.60687 16.5766 3.33795 16.9882 3.33795H19.0741C19.5126 3.33795 19.7323 3.60687 19.7323 4.06412V7.18715C20.6108 7.16004 21.653 7.13292 22.3119 7.13292C22.5592 7.13292 22.7512 7.26775 22.7512 7.56379V9.20591C22.7512 9.58255 22.5869 9.69026 22.285 9.69026C21.653 9.69026 20.6385 9.66315 19.7323 9.66315V13.1628C19.7323 15.2087 20.2814 16.4199 22.0654 16.4199C23.9983 16.4199 25.2417 14.5146 25.7701 13.2203L25.7699 7.67092C25.7699 7.18656 26.0172 6.97113 26.4557 6.97113H28.5968C29.063 6.97113 29.2826 7.24079 29.2826 7.64454C29.2826 9.31377 29.1459 12.0858 29.1459 13.8899C29.1459 15.5855 29.5568 16.4201 30.7925 16.4201C32.7132 16.4201 34.3598 12.6515 34.3598 8.58614V7.67092C34.3598 7.24079 34.5518 6.97113 35.0187 6.97113H37.1868C37.6529 6.97113 37.8726 7.21367 37.8726 7.67092C37.8726 8.14764 37.7549 9.87183 37.6737 11.6249L37.6495 12.1781C37.6193 12.9131 37.5984 13.6305 37.5984 14.2394C37.5984 15.4235 38.0922 16.4201 39.1082 16.4201C40.2413 16.4201 41.2197 15.2363 41.846 14.1225C41.8136 13.8205 41.7974 13.509 41.7974 13.1896C41.7974 9.66359 44.0753 6.62116 47.7532 6.62116C49.4543 6.62116 50.9918 7.42867 51.8419 8.07496L51.9518 8.04858V1.26467C51.9518 0.80743 52.1714 0.564886 52.583 0.564886H54.6144ZM74.1817 9.31362C72.1235 9.31362 70.9708 11.1712 70.9708 13.0551C70.9708 15.101 72.1781 16.6625 74.0443 16.6625C76.0479 16.6625 77.1185 14.8855 77.1185 12.7591C77.1185 10.848 76.1301 9.31362 74.1817 9.31362ZM48.8506 9.55587C46.847 9.55587 45.3379 11.1438 45.3379 13.378C45.3379 15.2355 46.3531 16.4197 47.8353 16.4197C50.2507 16.4197 51.5401 12.9471 51.5401 10.74C50.9641 10.2014 49.9757 9.55587 48.8506 9.55587ZM107.225 9.55587C105.221 9.55587 103.712 11.1438 103.712 13.4051C103.712 15.2084 104.728 16.4197 106.155 16.4197C108.734 16.4197 109.915 12.7859 109.915 10.74C109.338 10.2014 108.35 9.55587 107.225 9.55587ZM61.4752 1.21074C62.4905 1.21074 63.3414 1.77643 63.3414 2.93347C63.3414 4.03774 62.6003 4.81813 61.3654 4.81813C60.2949 4.81813 59.5545 4.09123 59.5545 2.96058C59.5545 1.93764 60.3494 1.21074 61.4752 1.21074ZM119.41 1.21074C120.426 1.21074 121.276 1.77643 121.276 2.93347C121.276 4.03774 120.536 4.81813 119.3 4.81813C118.23 4.81813 117.489 4.09123 117.489 2.96058C117.489 1.93764 118.285 1.21074 119.41 1.21074Z" fill="white" /> </svg> </div> <div class="row__logo logo flex"> <svg width="128" height="36" viewBox="0 0 128 36" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M52.9924 0.0216131C53.051 0.0809432 53.0655 0.168243 53.0357 0.286056C53.0068 0.549651 52.9482 0.960723 52.8597 1.51758C56.5673 1.4591 59.4358 1.59132 61.466 1.91339C61.6717 1.94306 61. … [Строка слишком длинная. Вы можете скачать файл] fill="white" /> </svg> </div> </div> </div> </div> </div> </section> <!-- & шестая секция конец --> <!-- & седьмая секция начало --> <!-- section-template блок section-one первая секция--> <section class="section-template section-three"> <!-- section-template__background Элемент для фона, который содержит изображение. --> <div class="section-template__background flex"> <!-- section-template__content Элемент-контейнер для размещения заголовка и описания. --> <div class="section-template__content flex"> <!-- section-template__title Элемент заголовка (h3) блока. --> <h3 class="section-template__title">The swirling staircase</h3> <!-- section-template__description Элемент абзаца с описанием. --> <p class="section-template__description">Lorem ipsum dolor sit amet, dolor sit amet dolor sit amet.</p> </div> </div> </section> <!-- & седьмая секция конец --> <!-- & восьмая секция начало --> <!-- projects — это основной блок, который представляет секцию проектов. --> <section class="projects"> <!-- projects__container — контейнер для элементов внутри блока. --> <div class="projects__container container"> <!-- projects__header — элемент, содержащий заголовок и подзаголовок. --> <div class="projects__header"> <!-- projects__title и projects__subtitle — элементы заголовка и подзаголовка соответственно. --> <h2 class="projects__title">Featured projects</h2> <h3 class="projects__subtitle">Some of the latest and greatest projects from us here at Wishbone+Partners. </h3> </div> <!-- projects__items — контейнер для всех проектов. --> <div class="projects__items flex"> <!-- projects__item — элемент, представляющий отдельный проект. --> <div class="projects__item"> <!-- projects__image — элемент для изображений проектов. --> <img class="projects__image" src="images/project-img-1.jpg" alt=""> </div> <!-- projects__item — элемент, представляющий отдельный проект. --> <div class="projects__item"> <!-- projects__image — элемент для изображений проектов. --> <img class="projects__image" src="images/project-img-2.jpg" alt=""> <!-- projects__location и projects__name — элементы, представляющие местоположение и название проекта соответственно. --> <p class="projects__location">New York</p> <p class="projects__name">Big Road Brewery</p> <a class="projects__link btn-reset btn" href="">Read more</a> </div> <!-- projects__item — элемент, представляющий отдельный проект. --> <div class="projects__item"> <!-- projects__image — элемент для изображений проектов. --> <img class="projects__image" src="images/project-img-3.jpg" alt=""> </div> </div> <!-- projects__link — элемент для ссылок на чтение подробнее. --> <div class="projects__more-link btn-reset"> <!-- projects__more-link — контейнер для ссылки на дополнительные проекты. --> <a class="projects__link" href="#">View all projects</a> </div> </div> </section> <!-- & восьмая секция конец --> <!-- & девятая секция начало --> <!-- team — основной блок, который представляет команду --> <section class="team"> <!-- team__container — контейнер для всей команды. --> <div class="team__container container flex"> <!-- team__intro — блок для заголовка и описания команды. --> <div class="team__intro flex"> <!-- team__title, team__description, team__link — элементы внутри блока intro. --> <h2 class="team__title">Meet our team</h2> <p class="team__description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis.</p> <a href="#" class="team__link btn-reset">See team</a> </div> <!-- team__members — блок всех членов команды. --> <div class="team_members flex"> <!-- team__member — каждый отдельный член команды. --> <div class="team__member"> <!-- team__member-image --> <div class="team__member-image"> <img src="images/team-member-img1.jpg" alt="Stephen Collier"> </div> <!-- team__member-info — элемент для информации о члене команды (имя и роль). --> <div class="team__member-info"> <!-- team__member-name, team__member-role — элементы для имени и роли соответственно. --> <p class="team__member-name">Stephen Collier</p> <span class="team__member-role">Senior Partner</span> </div> </div> <div class="team__member"> <div class="team__member-image"> <img src="images/team-member-img2.jpg" alt="Nolan Peters"> </div> <div class="team__member-info"> <p class="team__member-name">Nolan Peters</p> <span class="team__member-role">Associate</span> </div> </div> <div class="team__member"> <div class="team__member-image"> <img src="images/team-member-img3.jpg" alt="Ferris Wonder"> </div> <div class="team__member-info"> <p class="team__member-name">Ferris Wonder</p> <span class="team__member-role">Associate Partner</span> </div> </div> <div class="team__member"> <div class="team__member-image"> <img src="images/team-member-img4.jpg" alt="Aria Stone"> </div> <div class="team__member-info"> <p class="team__member-name">Aria Stone</p> <span class="team__member-role">Senior Partner</span> </div> </div> <div class="team__member"> <div class="team__member-image"> <img src="images/team-member-img5.jpg" alt="Niko Ferry"> </div> <div class="team__member-info"> <p class="team__member-name">Niko Ferry</p> <span class="team__member-role">Partner</span> </div> </div> </div> </div> </section> <!-- & девятая секция конец --> <!-- & десятая секция начало --> <!-- contact — основной блок, который представляет секцию контактов. --> <section class="contact"> <!-- contact__container — контейнер для всей секции. --> <div class="contact__container container flex"> <!-- contact__intro — блок для заголовка и подзаголовка. --> <div class="contact__intro"> <!-- contact__subtitle — элемент для подзаголовка "Get in touch". --> <h4 class="contact__subtitle">Get in touch</h4> <!-- contact__title — элемент для заголовка "Think we would be a good fit for your next project?". --> <h2 class="contact__title">Think we would be a good fit for your next project?</h2> </div> <!-- contact__action — блок для действия (ссылки). --> <div class="contact__action"> <!-- contact__link — элемент для ссылки "Get in touch". --> <a href="#" class="contact__link">Get in touch</a> </div> </div> </section> <!-- & десятая секция конец --> </article> </main> <!-- & конец контента --> <!-- & "подвал сайта начало" --> <!-- footer — основной блок, представляющий нижний колонтитул. --> <footer class="footer"> <div class="footer__container container flex"> <div class="footer__info"> <div class="footer__logo"> <svg width="256" height="22" viewBox="0 0 256 22" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M40.0427 5.93102C41.7976 5.93102 43.2118 6.37817 44.2852 7.27246C45.3587 8.16675 45.9327 9.38581 46.0074 10.9296H42.815C42.759 10.233 42.479 9.67763 41.975 9.26343C41.4709 8.84923 40.7895 8 … [Строка слишком длинная. Вы можете скачать файл] fill="#1B1A1A" /> </svg> </div> <p class="footer__powered">Powered by Webflow</p> <p class="footer__rights">All rights reserved Wishbone+Partners, Inc. Licensing</p> </div> <nav class="footer__nav"> <ul class="footer__nav-list"> <li class="footer__nav-item"> <a href="#" class="footer__nav-link"> <svg width="24" height="20" viewBox="0 0 24 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M24 2.30654C23.1169 2.69873 22.168 2.96203 21.1724 3.0827C22.1899 2.47384 22.9688 1.50844 23.3363 0.359283C22.3846 0.924262 21.3288 1.33291 20.2098 1.55506C19.313 0.59789 18.0322 0 16.6171 0C13.8965 0 11.6915 2.20232 11.6915 4.923C11.6915 5.3097 11.7353 5.68544 11.8176 6.04473C7.72575 5.83903 4.09736 3.8808 1.67021 0.899578C1.24786 1.62637 1.00377 2.47384 1.00377 3.37616C1.00377 5.08481 1.87316 6.59051 3.19232 7.47363C2.38601 7.44895 1.62633 7.22679 0.962633 6.85654V6.91962C0.962633 9.3057 2.66027 11.2941 4.9119 11.7466C4.50051 11.8591 4.06445 11.9194 3.61467 11.9194C3.29654 11.9194 2.98937 11.8892 2.69044 11.8316C3.31574 13.7871 5.13404 15.2105 7.28694 15.2517C5.60302 16.5709 3.48303 17.358 1.17381 17.358C0.77614 17.358 0.386699 17.3361 0 17.2895C2.18032 18.6854 4.76654 19.5 7.54748 19.5C16.6034 19.5 21.5564 11.9989 21.5564 5.49346C21.5564 5.27954 21.5509 5.06835 21.5427 4.85717C22.5053 4.16055 23.3418 3.29388 24 2.30654Z" fill="#1B1A1A" /> </svg> </a> </li> <li class="footer__nav-item"> <a href="#" class="footer__nav-link"> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M12 5.76825C8.5638 5.76825 5.76825 8.5638 5.76825 12C5.76825 15.4362 8.5638 18.2293 12 18.2293C15.4362 18.2293 18.2293 15.4338 18.2293 12C18.2317 8.5638 15.4362 5.76825 12 5.76825ZM12 15.8536C9.87422 15.8536 8.14641 14.1258 8.14641 12C8.14641 9.87422 9.87422 8.14641 12 8.14641C14.1258 8.14641 15.8536 9.87422 15.8536 12C15.8536 14.1258 14.1258 15.8536 12 15.8536ZM17.0936 0H6.90637C3.09889 0 0 3.09889 0 6.90637V17.0936C0 20.9011 3.09889 24 6.90637 24H17.0936C20.9011 24 24 20.9011 24 17.0936V6.90637C24 3.09889 20.9035 0 17.0936 0ZM21.6243 17.0936C21.6243 19.5907 19.5907 21.6218 17.0936 21.6218H6.90637C4.4093 21.6218 2.37816 19.5907 2.37816 17.0936V6.90637C2.37816 4.4093 4.4093 2.37816 6.90637 2.37816H17.0936C19.5907 2.37816 21.6218 4.4093 21.6218 6.90637V17.0936H21.6243ZM18.3167 3.96764C17.4188 3.96764 16.6859 4.69808 16.6859 5.59838C16.6859 6.49626 17.4164 7.22912 18.3167 7.22912C19.2146 7.22912 19.9474 6.49869 19.9474 5.59838C19.9474 4.69808 19.2146 3.96764 18.3167 3.96764Z" fill="#1B1A1A" /> </svg> </a> </li> <li class="footer__nav-item"> <a href="#" class="footer__nav-link"> <svg width="12" height="24" viewBox="0 0 12 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11.25 7.7714H7.41515V5.2806C7.41515 4.34518 8.04322 4.12573 8.48315 4.12573H11.1836V0.0137159L7.45942 0C3.32852 0 2.39056 3.06686 2.39056 5.03098V7.7714H0V12.0069H2.39056V24H7.41792V12.0096H10.8101L11.25 7.7714Z" fill="#1B1A1A" /> </svg> </a> </li> </ul> </nav> </div> </footer> <!-- & "подвал сайта конец" --> </div> <!-- ~ подключаем файл со скриптами сторонних библиотек --> <script src=""></script> <!-- ~ наш файл со скриптами --> <script src="js/main.js"></script> </body> </html>