├── .nojekyll ├── blocks ├── photo-grid │ ├── __item │ │ └── photo-grid__item.css │ ├── __image │ │ └── photo-grid__image.css │ └── photo-grid.css ├── intro │ ├── __span │ │ └── intro__span.css │ ├── __title │ │ └── intro__title.css │ ├── __text │ │ └── intro__text.css │ ├── __list │ │ └── intro__list.css │ └── intro.css ├── header │ ├── __lang-links │ │ └── header__lang-links.css │ ├── __lang-link │ │ ├── _active │ │ │ └── header__lang-link_active.css │ │ └── header__lang-link.css │ ├── __logo │ │ └── header__logo.css │ └── header.css ├── place │ ├── __website │ │ └── place__website.css │ ├── __image │ │ └── place__image.css │ ├── __url-heading │ │ └── place__url-heading.css │ ├── __link │ │ └── place__link.css │ ├── __title │ │ └── place__title.css │ ├── __paragraph │ │ └── place__paragraph.css │ └── place.css ├── page │ └── page.css ├── root │ └── root.css ├── cover │ ├── __overlay │ │ └── cover__overlay.css │ ├── __title │ │ └── cover__title.css │ ├── __subtitle │ │ └── cover__subtitle.css │ └── cover.css ├── footer │ ├── __links │ │ └── footer__links.css │ ├── __copyright │ │ └── footer__copyright.css │ ├── __link │ │ └── footer__link.css │ └── footer.css ├── lead │ ├── __image │ │ └── lead__image.css │ ├── __caption │ │ └── lead__caption.css │ ├── lead.css │ ├── __subtitle │ │ └── lead__subtitile.css │ └── __title │ │ └── lead__title.css └── places │ └── places.css ├── images ├── .DS_Store ├── cover-trains.jpg ├── lead-polka.jpg ├── place-altai.jpg ├── place-kolsky.jpg ├── place-kosa.jpg ├── place-karelia.jpg ├── photo-grid-arisa.jpg ├── photo-grid-baikal.jpg ├── photo-grid-elbrus.jpg ├── photo-grid-ergaki.jpg ├── photo-grid-sochi.jpg ├── photo-grid-train.jpg ├── photo-grid-tuman.jpg ├── photo-grid-baikal-2.jpg ├── place-winter-baikal.jpg ├── photo-grid-kamchatka-1.jpg ├── photo-grid-kamchatka-2.jpg ├── photo-grid-kondratiev.jpg ├── photo-grid-atharva-tulsi.jpg └── header-logo.svg ├── fonts ├── Inter-Black.woff ├── Inter-Black.woff2 ├── Inter-Bold.woff ├── Inter-Bold.woff2 ├── Inter-Regular.woff ├── Inter-Regular.woff2 └── inter.css ├── .idea ├── .gitignore ├── vcs.xml ├── modules.xml └── russian-travel.iml ├── README.md ├── pages └── index.css ├── vendor └── normalize.css └── index.html /.nojekyll: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /blocks/photo-grid/__item/photo-grid__item.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /blocks/intro/__span/intro__span.css: -------------------------------------------------------------------------------- 1 | .intro__span { 2 | font-weight: 400; 3 | } -------------------------------------------------------------------------------- /images/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/.DS_Store -------------------------------------------------------------------------------- /blocks/header/__lang-links/header__lang-links.css: -------------------------------------------------------------------------------- 1 | .header__lang-links { 2 | display: flex; 3 | } -------------------------------------------------------------------------------- /fonts/Inter-Black.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/fonts/Inter-Black.woff -------------------------------------------------------------------------------- /fonts/Inter-Black.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/fonts/Inter-Black.woff2 -------------------------------------------------------------------------------- /fonts/Inter-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/fonts/Inter-Bold.woff -------------------------------------------------------------------------------- /fonts/Inter-Bold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/fonts/Inter-Bold.woff2 -------------------------------------------------------------------------------- /images/cover-trains.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/cover-trains.jpg -------------------------------------------------------------------------------- /images/lead-polka.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/lead-polka.jpg -------------------------------------------------------------------------------- /images/place-altai.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/place-altai.jpg -------------------------------------------------------------------------------- /images/place-kolsky.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/place-kolsky.jpg -------------------------------------------------------------------------------- /images/place-kosa.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/place-kosa.jpg -------------------------------------------------------------------------------- /fonts/Inter-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/fonts/Inter-Regular.woff -------------------------------------------------------------------------------- /fonts/Inter-Regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/fonts/Inter-Regular.woff2 -------------------------------------------------------------------------------- /images/place-karelia.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/place-karelia.jpg -------------------------------------------------------------------------------- /images/photo-grid-arisa.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-arisa.jpg -------------------------------------------------------------------------------- /images/photo-grid-baikal.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-baikal.jpg -------------------------------------------------------------------------------- /images/photo-grid-elbrus.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-elbrus.jpg -------------------------------------------------------------------------------- /images/photo-grid-ergaki.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-ergaki.jpg -------------------------------------------------------------------------------- /images/photo-grid-sochi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-sochi.jpg -------------------------------------------------------------------------------- /images/photo-grid-train.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-train.jpg -------------------------------------------------------------------------------- /images/photo-grid-tuman.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-tuman.jpg -------------------------------------------------------------------------------- /images/photo-grid-baikal-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-baikal-2.jpg -------------------------------------------------------------------------------- /images/place-winter-baikal.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/place-winter-baikal.jpg -------------------------------------------------------------------------------- /blocks/photo-grid/__image/photo-grid__image.css: -------------------------------------------------------------------------------- 1 | .photo-grid__image { 2 | width: 100%; 3 | object-fit: cover; 4 | } -------------------------------------------------------------------------------- /images/photo-grid-kamchatka-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-kamchatka-1.jpg -------------------------------------------------------------------------------- /images/photo-grid-kamchatka-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-kamchatka-2.jpg -------------------------------------------------------------------------------- /images/photo-grid-kondratiev.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-kondratiev.jpg -------------------------------------------------------------------------------- /images/photo-grid-atharva-tulsi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dacorm/russian-travel/HEAD/images/photo-grid-atharva-tulsi.jpg -------------------------------------------------------------------------------- /.idea/.gitignore: -------------------------------------------------------------------------------- 1 | # Default ignored files 2 | /shelf/ 3 | /workspace.xml 4 | # Editor-based HTTP Client requests 5 | /httpRequests/ 6 | -------------------------------------------------------------------------------- /blocks/header/__lang-link/_active/header__lang-link_active.css: -------------------------------------------------------------------------------- 1 | .header__lang-link_active { 2 | text-decoration-line: underline; 3 | } -------------------------------------------------------------------------------- /blocks/place/__website/place__website.css: -------------------------------------------------------------------------------- 1 | .place__website { 2 | display: flex; 3 | flex-direction: column; 4 | justify-content: end; 5 | margin: 0; 6 | } -------------------------------------------------------------------------------- /blocks/header/__logo/header__logo.css: -------------------------------------------------------------------------------- 1 | .header__logo { 2 | max-width: 176px; 3 | } 4 | 5 | @media screen and (max-width: 767px) { 6 | .header__logo { 7 | max-width: 142px; 8 | } 9 | } -------------------------------------------------------------------------------- /.idea/vcs.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /blocks/page/page.css: -------------------------------------------------------------------------------- 1 | .page { 2 | max-width: 1280px; 3 | font-family: 'Inter', sans-serif; 4 | align-self: center; 5 | } 6 | 7 | @media screen and (min-width: 1281px) { 8 | .page { 9 | margin: 0 auto; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /blocks/place/__image/place__image.css: -------------------------------------------------------------------------------- 1 | .place__image { 2 | width: 100%; 3 | object-fit: cover; 4 | margin: 0; 5 | } 6 | 7 | 8 | @media screen and (max-width: 767px) { 9 | .place__image { 10 | margin: 0 auto; 11 | } 12 | } -------------------------------------------------------------------------------- /blocks/root/root.css: -------------------------------------------------------------------------------- 1 | .root { 2 | background-color: #2A2C2F; 3 | -webkit-font-smoothing: antialiased; 4 | -moz-osx-font-smoothing: grayscale; 5 | -webkit-text-size-adjust: 100%; 6 | -ms-text-size-adjust: 100%; 7 | -moz-text-size-adjust: 100%; 8 | text-rendering: optimizeLegibility; 9 | } -------------------------------------------------------------------------------- /.idea/modules.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /blocks/cover/__overlay/cover__overlay.css: -------------------------------------------------------------------------------- 1 | .cover__overlay { 2 | position: absolute; 3 | top: 0; 4 | right: 0; 5 | width: 100%; 6 | height: 100%; 7 | background: #2A2C2F; 8 | opacity: .3; 9 | } 10 | 11 | .cover:hover .cover__overlay { 12 | opacity: 0.8; 13 | cursor: pointer; 14 | } -------------------------------------------------------------------------------- /blocks/footer/__links/footer__links.css: -------------------------------------------------------------------------------- 1 | .footer__links { 2 | list-style-type: none; 3 | display: flex; 4 | flex-direction: row; 5 | padding: 0; 6 | margin: 0; 7 | } 8 | 9 | @media screen and (max-width: 767px) { 10 | .footer__links { 11 | flex-direction: column; 12 | margin-bottom: 46px; 13 | gap: 32px; 14 | } 15 | } -------------------------------------------------------------------------------- /blocks/lead/__image/lead__image.css: -------------------------------------------------------------------------------- 1 | .lead__image { 2 | width: 100%; 3 | object-fit: cover; 4 | margin: 64px 0 0 0; 5 | } 6 | 7 | @media screen and (max-width: 1279px) { 8 | .lead__image { 9 | margin: 56px 0 0 0; 10 | } 11 | } 12 | 13 | @media screen and (max-width: 767px) { 14 | .lead__image { 15 | margin: 40px 0 0 0; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /blocks/footer/__copyright/footer__copyright.css: -------------------------------------------------------------------------------- 1 | .footer__copyright { 2 | font-family: 'Inter', Arial, sans-serif; 3 | font-style: normal; 4 | font-weight: 400; 5 | font-size: 14px; 6 | line-height: 16px; 7 | text-align: right; 8 | color: #FFFFFF; 9 | margin: 0; 10 | } 11 | 12 | @media screen and (max-width: 767px) { 13 | .footer__copyright { 14 | text-align: left; 15 | } 16 | } -------------------------------------------------------------------------------- /blocks/place/__url-heading/place__url-heading.css: -------------------------------------------------------------------------------- 1 | .place__url-heading { 2 | font-family: 'Inter', Arial, sans-serif; 3 | font-style: normal; 4 | font-weight: 400; 5 | font-size: 12px; 6 | line-height: 12px; 7 | letter-spacing: 2px; 8 | color: #AAAAAA; 9 | margin: 0 0 12px 0; 10 | } 11 | 12 | @media screen and (max-width: 767px) { 13 | .place__url-heading { 14 | margin-left: 16px; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /blocks/places/places.css: -------------------------------------------------------------------------------- 1 | .places { 2 | max-width: 984px; 3 | margin: 0 auto; 4 | padding-top: 92px; 5 | } 6 | 7 | @media screen and (max-width: 1279px) { 8 | .places { 9 | max-width: 928px; 10 | padding-top: 88px; 11 | } 12 | } 13 | 14 | @media screen and (max-width: 1023px) { 15 | .places { 16 | max-width: 720px; 17 | } 18 | } 19 | 20 | @media screen and (max-width: 767px) { 21 | .places { 22 | padding-top: 64px; 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /blocks/footer/__link/footer__link.css: -------------------------------------------------------------------------------- 1 | .footer__link { 2 | text-decoration: none; 3 | font-family: 'Inter', Arial, sans-serif; 4 | font-style: normal; 5 | font-weight: 400; 6 | font-size: 16px; 7 | line-height: 18px; 8 | color: #FFFFFF; 9 | margin: 0 18px 0 0; 10 | } 11 | 12 | .footer__link:hover { 13 | opacity: 0.8; 14 | } 15 | 16 | @media screen and (max-width: 767px) { 17 | .footer__link { 18 | font-size: 24px; 19 | line-height: 24px; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /.idea/russian-travel.iml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /blocks/lead/__caption/lead__caption.css: -------------------------------------------------------------------------------- 1 | .lead__caption { 2 | font-family: 'Inter', Arial, sans-serif; 3 | font-style: normal; 4 | font-weight: 400; 5 | font-size: 10px; 6 | line-height: 14px; 7 | letter-spacing: 1.5px; 8 | text-transform: uppercase; 9 | color: #FFFFFF; 10 | white-space: nowrap; 11 | margin: 8px 0 0 0; 12 | align-self: flex-start; 13 | } 14 | 15 | @media screen and (max-width: 1023px) { 16 | .lead__caption { 17 | margin: 8px 24px 0 24px; 18 | } 19 | } -------------------------------------------------------------------------------- /blocks/place/__link/place__link.css: -------------------------------------------------------------------------------- 1 | .place__link { 2 | font-family: 'Inter', Arial, sans-serif; 3 | font-style: normal; 4 | font-weight: 400; 5 | font-size: 18px; 6 | line-height: 22px; 7 | text-decoration-line: underline; 8 | color: #FFFFFF; 9 | margin: 0; 10 | padding: 0; 11 | 12 | } 13 | 14 | .place__link:hover { 15 | opacity: 0.8; 16 | cursor: pointer; 17 | } 18 | 19 | @media screen and (max-width: 767px) { 20 | .place__link { 21 | margin-left: 16px; 22 | } 23 | } 24 | 25 | -------------------------------------------------------------------------------- /blocks/cover/__title/cover__title.css: -------------------------------------------------------------------------------- 1 | .cover__title { 2 | max-width: 560px; 3 | font-family: 'Inter', Arial, sans-serif; 4 | font-style: normal; 5 | font-weight: 900; 6 | font-size: 72px; 7 | line-height: 76px; 8 | text-align: center; 9 | color: #FFFFFF; 10 | margin: 0 auto; 11 | z-index: 2; 12 | text-decoration: none; 13 | } 14 | 15 | @media screen and (max-width: 767px) { 16 | .cover__title { 17 | max-width: 288px; 18 | font-size: 32px; 19 | line-height: 35px; 20 | } 21 | } -------------------------------------------------------------------------------- /blocks/intro/__title/intro__title.css: -------------------------------------------------------------------------------- 1 | .intro__title { 2 | max-width: 720px; 3 | font-family: 'Inter', Arial, sans-serif; 4 | font-style: normal; 5 | font-weight: 900; 6 | font-size: 54px; 7 | line-height: 58px; 8 | color: #FFFFFF; 9 | margin: 0 0 40px 0; 10 | } 11 | 12 | 13 | @media screen and (max-width: 600px) { 14 | .intro__title { 15 | max-width: 690px; 16 | width: 100%; 17 | font-size: 32px; 18 | line-height: 35px; 19 | margin: 0 auto 40px 0; 20 | } 21 | } 22 | 23 | -------------------------------------------------------------------------------- /blocks/footer/footer.css: -------------------------------------------------------------------------------- 1 | .footer { 2 | display: flex; 3 | max-width: 1184px; 4 | justify-content: space-between; 5 | margin: 0 48px 24px 48px; 6 | padding-top: 92px; 7 | } 8 | 9 | @media screen and (max-width: 1023px) { 10 | .footer { 11 | max-width: 720px; 12 | margin: 0 auto 24px auto; 13 | padding-top: 88px; 14 | } 15 | } 16 | 17 | @media screen and (max-width: 767px) { 18 | .footer { 19 | flex-direction: column; 20 | margin: 64px auto 24px 0; 21 | padding: 0 0 0 16px; 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /blocks/intro/__text/intro__text.css: -------------------------------------------------------------------------------- 1 | .intro__text { 2 | max-width: 690px; 3 | width: 100%; 4 | font-family: 'Inter', Arial, sans-serif; 5 | font-style: normal; 6 | font-weight: 400; 7 | font-size: 16px; 8 | line-height: 163%; 9 | color: #FFFFFF; 10 | margin: 0; 11 | } 12 | 13 | @media screen and (max-width: 1023px) { 14 | .intro__text { 15 | max-width: 720px; 16 | } 17 | } 18 | 19 | @media screen and (max-width: 767px) { 20 | .intro__text { 21 | width: fit-content; 22 | margin: 0 0 34px 0; 23 | } 24 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Проект: Путешествие по России 2 | ---------------------------------- 3 | 4 | Третий проект курса "Яндекс.Практикум" о путешествиях по России. Адаптивный сайт 5 | 6 | **Используемые технологии:** 7 | 1. Языки HTML и CSS 8 | 2. Flexbox Верстка 9 | 3. Grid Layout 10 | 4. Медиа запросы для корректного отображения на всех устройствах 11 | 5. Организация файлов по БЭМ nested 12 | 13 | Ссылка на проект: https://dacorm.github.io/russian-travel/ 14 | 15 | Планы по доработке: 16 | 1. Внедрить форму для посетителей сайта, чтобы добавлять их любимые места для путешествий по России 17 | -------------------------------------------------------------------------------- /blocks/intro/__list/intro__list.css: -------------------------------------------------------------------------------- 1 | .intro__list { 2 | list-style-type: none; 3 | max-width: 690px; 4 | margin: 33px 0 0 0; 5 | padding: 0; 6 | font-family: 'Inter', Arial, sans-serif; 7 | font-style: normal; 8 | font-weight: 700; 9 | font-size: 12px; 10 | line-height: 18px; 11 | color: #FFFFFF; 12 | } 13 | 14 | @media screen and (max-width: 1023px) { 15 | .intro__list { 16 | margin: 33px 24px 0 0; 17 | } 18 | } 19 | 20 | @media screen and (max-width: 767px) { 21 | .intro__list { 22 | margin: 0 16px 0 0; 23 | width: 100%; 24 | } 25 | } -------------------------------------------------------------------------------- /blocks/cover/__subtitle/cover__subtitle.css: -------------------------------------------------------------------------------- 1 | .cover__subtitle { 2 | max-width: 360px; 3 | font-family: 'Inter', Arial, sans-serif; 4 | font-style: normal; 5 | font-weight: 400; 6 | font-size: 18px; 7 | line-height: 22px; 8 | text-align: center; 9 | color: #FFFFFF; 10 | margin: 32px auto 0 auto; 11 | z-index: 2; 12 | text-decoration: none; 13 | } 14 | 15 | @media screen and (max-width: 767px) { 16 | .cover__subtitle { 17 | max-width: 288px; 18 | font-size: 14px; 19 | line-height: 16px; 20 | margin-top: 16px; 21 | } 22 | } 23 | 24 | 25 | -------------------------------------------------------------------------------- /blocks/lead/lead.css: -------------------------------------------------------------------------------- 1 | .lead { 2 | display: flex; 3 | flex-direction: column; 4 | align-items: center; 5 | width: calc(100% - 148px * 2); 6 | margin: 0; 7 | padding: 56px 148px 0 148px; 8 | } 9 | 10 | @media screen and (max-width: 1279px) { 11 | .lead { 12 | width: calc(100% - 48px * 2); 13 | padding: 48px 48px 0 48px; 14 | } 15 | } 16 | 17 | @media screen and (max-width: 1023px) { 18 | .lead { 19 | width: 100%; 20 | padding: 48px 0 0 0; 21 | } 22 | } 23 | 24 | @media screen and (max-width: 767px) { 25 | .lead { 26 | max-width: 928px; 27 | } 28 | } -------------------------------------------------------------------------------- /blocks/place/__title/place__title.css: -------------------------------------------------------------------------------- 1 | .place__title { 2 | font-family: 'Inter', Arial, sans-serif; 3 | font-style: normal; 4 | font-weight: 900; 5 | font-size: 72px; 6 | line-height: 76px; 7 | color: #FFFFFF; 8 | margin: 0; 9 | } 10 | 11 | 12 | 13 | @media screen and (max-width: 1023px) { 14 | .place__title { 15 | font-size: 42px; 16 | line-height: 46px; 17 | } 18 | } 19 | 20 | @media screen and (max-width: 767px) { 21 | .place__title { 22 | max-width: 460px; 23 | font-size: 32px; 24 | line-height: 35px; 25 | margin: 0 16px 0 16px; 26 | } 27 | } -------------------------------------------------------------------------------- /blocks/header/__lang-link/header__lang-link.css: -------------------------------------------------------------------------------- 1 | .header__lang-link { 2 | font-family: 'Inter', Arial, sans-serif; 3 | font-style: normal; 4 | font-weight: 400; 5 | font-size: 24px; 6 | line-height: 28px; 7 | text-align: right; 8 | color: #FFFFFF; 9 | margin: 18px 18px 6px 0; 10 | text-decoration: none; 11 | } 12 | 13 | .header__lang-link:last-of-type { 14 | margin-right: 0; 15 | } 16 | 17 | .header__lang-link:hover { 18 | opacity: 0.8; 19 | } 20 | 21 | @media screen and (max-width: 767px) { 22 | .header__lang-link { 23 | font-size: 18px; 24 | line-height: 20px; 25 | } 26 | } -------------------------------------------------------------------------------- /blocks/header/header.css: -------------------------------------------------------------------------------- 1 | .header { 2 | display: flex; 3 | width: calc(100% - 96px); 4 | margin: 0; 5 | justify-content: space-between; 6 | padding-top: 28px; 7 | padding-left: 48px; 8 | padding-right: 48px; 9 | } 10 | 11 | @media screen and (max-width: 1023px) { 12 | .header { 13 | width: calc(100% - 48px); 14 | padding-left: 24px; 15 | padding-right: 24px; 16 | } 17 | } 18 | 19 | @media screen and (max-width: 725px) { 20 | .header { 21 | width: calc(100% - 32px); 22 | padding-top: 16px; 23 | padding-left: 16px; 24 | padding-right: 16px; 25 | } 26 | } -------------------------------------------------------------------------------- /blocks/lead/__subtitle/lead__subtitile.css: -------------------------------------------------------------------------------- 1 | .lead__subtitle { 2 | max-width: 640px; 3 | width: 100%; 4 | font-family: 'Inter', Arial, sans-serif; 5 | font-style: normal; 6 | font-weight: 400; 7 | font-size: 30px; 8 | line-height: 36px; 9 | text-align: center; 10 | color: #FFFFFF; 11 | margin: 32px auto 0 auto; 12 | } 13 | 14 | @media screen and (max-width: 600px) { 15 | .lead__subtitle { 16 | font-size: 16px; 17 | line-height: 20px; 18 | margin: 16px auto 0 auto; 19 | } 20 | } 21 | 22 | @media screen and (min-width: 321px) { 23 | .lead__subtitle { 24 | max-width: 640px; 25 | } 26 | } -------------------------------------------------------------------------------- /blocks/intro/intro.css: -------------------------------------------------------------------------------- 1 | .intro { 2 | display: flex; 3 | flex-direction: column; 4 | width: calc(100% - 148px * 2); 5 | max-width: 720px; 6 | margin: 0; 7 | padding: 92px 148px 0 148px; 8 | } 9 | 10 | 11 | @media screen and (max-width: 1279px) { 12 | .intro { 13 | width: calc(100% - 96px); 14 | padding: 92px 48px 0 48px; 15 | } 16 | } 17 | 18 | @media screen and (max-width: 1023px) { 19 | .intro { 20 | width: calc(100% - 24px * 2); 21 | padding: 88px 24px 0 24px; 22 | } 23 | } 24 | 25 | @media screen and (max-width: 767px) { 26 | .intro { 27 | width: calc(100% - 16px * 2); 28 | padding: 64px 16px 0 16px; 29 | } 30 | } -------------------------------------------------------------------------------- /fonts/inter.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "Inter"; 3 | font-style: normal; 4 | font-weight: 400; 5 | font-display: swap; 6 | src: url("Inter-Regular.woff2?v=3.19") format("woff2"), 7 | url("Inter-Regular.woff?v=3.19") format("woff"); 8 | } 9 | 10 | @font-face { 11 | font-family: "Inter"; 12 | font-style: normal; 13 | font-weight: 700; 14 | font-display: swap; 15 | src: url("Inter-Bold.woff2?v=3.19") format("woff2"), 16 | url("Inter-Bold.woff?v=3.19") format("woff"); 17 | } 18 | 19 | @font-face { 20 | font-family: "Inter"; 21 | font-style: normal; 22 | font-weight: 900; 23 | font-display: swap; 24 | src: url("Inter-Black.woff2?v=3.19") format("woff2"), 25 | url("Inter-Black.woff?v=3.19") format("woff"); 26 | } 27 | -------------------------------------------------------------------------------- /blocks/lead/__title/lead__title.css: -------------------------------------------------------------------------------- 1 | .lead__title { 2 | max-width: 720px; 3 | width: 100%; 4 | font-family: 'Inter', Arial, sans-serif; 5 | font-style: normal; 6 | font-weight: 900; 7 | font-size: 96px; 8 | line-height: 100px; 9 | text-align: center; 10 | color: #FFFFFF; 11 | margin: 56px auto 0 auto; 12 | } 13 | 14 | @media screen and (max-width: 1023px) { 15 | .lead__title { 16 | margin: 0 24px 0 24px; 17 | } 18 | } 19 | 20 | @media screen and (max-width: 767px) { 21 | .lead__title { 22 | max-width: 288px; 23 | font-size: 40px; 24 | line-height: 44px; 25 | margin: 0 auto; 26 | } 27 | } 28 | 29 | @media screen and (min-width: 321px) { 30 | .lead__title { 31 | max-width: 720px; 32 | margin: 0 auto 0 auto; 33 | } 34 | } -------------------------------------------------------------------------------- /blocks/cover/cover.css: -------------------------------------------------------------------------------- 1 | .cover { 2 | position: relative; 3 | display: flex; 4 | max-width: 1184px; 5 | min-height: 740px; 6 | flex-direction: column; 7 | background-image: url("../../images/cover-trains.jpg"); 8 | background-size: cover; 9 | background-repeat: no-repeat; 10 | background-position: center; 11 | margin: 92px auto 0 auto; 12 | align-items: center; 13 | justify-content: center; 14 | text-decoration: none; 15 | color: #000; 16 | } 17 | 18 | 19 | @media screen and (max-width: 1279px) { 20 | .cover { 21 | min-height: 640px; 22 | } 23 | } 24 | 25 | @media screen and (max-width: 1023px) { 26 | .cover { 27 | min-height: 480px; 28 | margin-top: 90px; 29 | } 30 | } 31 | 32 | @media screen and (max-width: 767px) { 33 | .cover { 34 | margin-top: 66px; 35 | min-height: 200px; 36 | } 37 | } -------------------------------------------------------------------------------- /blocks/place/__paragraph/place__paragraph.css: -------------------------------------------------------------------------------- 1 | .place__paragraph { 2 | font-family: 'Inter', Arial, sans-serif; 3 | font-style: normal; 4 | font-weight: 400; 5 | font-size: 18px; 6 | line-height: 163%; 7 | color: #FFFFFF; 8 | margin: 0 0 26px 0; 9 | padding: 0; 10 | box-sizing: border-box; 11 | } 12 | 13 | 14 | .place__paragraph:nth-of-type(2n) { 15 | margin-bottom: 0; 16 | } 17 | 18 | @media screen and (max-width: 1023px) { 19 | .place__paragraph { 20 | max-width: 352px; 21 | font-size: 16px; 22 | } 23 | 24 | .place__paragraph:last-of-type { 25 | margin-bottom: 0; 26 | } 27 | } 28 | 29 | @media screen and (max-width: 767px) { 30 | .place__paragraph { 31 | max-width: 484px; 32 | width: 100%; 33 | margin: 0 auto 26px auto; 34 | padding-left: 16px; 35 | padding-right: 16px; 36 | align-self: center; 37 | } 38 | } -------------------------------------------------------------------------------- /blocks/place/place.css: -------------------------------------------------------------------------------- 1 | 2 | .place { 3 | display: grid; 4 | grid-template-columns: minmax(440px, 460px) 1fr; 5 | grid-template-rows: repeat(2, min-content); 6 | gap: 40px; 7 | padding-top: 80px; 8 | } 9 | 10 | .place:first-of-type { 11 | padding-top: 0; 12 | } 13 | 14 | 15 | 16 | 17 | @media screen and (max-width: 1279px) { 18 | .place { 19 | grid-template-columns: 440px 1fr; 20 | padding-top: 80px; 21 | grid-column-gap: 32px; 22 | grid-row-gap: 48px; 23 | } 24 | } 25 | 26 | @media screen and (max-width: 1023px) { 27 | .place { 28 | grid-template-columns: minmax(340px, 440px) minmax(352px, 456px); 29 | padding-top: 72px; 30 | grid-column-gap: 28px; 31 | } 32 | } 33 | 34 | 35 | @media screen and (max-width: 767px) { 36 | .place { 37 | grid: 600px auto / 1fr; 38 | grid-template-rows: 1fr; 39 | padding-left: 0; 40 | padding-top: 50px; 41 | grid-row-gap: 32px; 42 | } 43 | } -------------------------------------------------------------------------------- /blocks/photo-grid/photo-grid.css: -------------------------------------------------------------------------------- 1 | .photo-grid { 2 | display: grid; 3 | max-width: 1184px; 4 | grid-template-columns: repeat(4, 1fr); 5 | grid-template-rows: repeat(auto-fit, 1fr); 6 | gap: 16px; 7 | margin: 92px 48px 0 48px; 8 | } 9 | 10 | @media screen and (max-width: 1279px) { 11 | .photo-grid { 12 | grid-template-columns: repeat(3, 1fr); 13 | margin-left: 48px; 14 | margin-right: 48px; 15 | } 16 | } 17 | 18 | @media screen and (max-width: 1023px) { 19 | .photo-grid { 20 | grid-template-columns: repeat(2, 1fr); 21 | margin-right: 24px; 22 | margin-left: 24px; 23 | } 24 | } 25 | 26 | @media screen and (max-width: 767px) { 27 | .photo-grid { 28 | grid-template-rows: repeat(2, min-content); 29 | margin-left: 16px; 30 | margin-right: 16px; 31 | } 32 | } 33 | 34 | @media screen and (max-width: 500px) { 35 | .photo-grid { 36 | grid-template-columns: repeat(1, 1fr); 37 | grid-template-rows: repeat(1, min-content); 38 | margin-top: 64px; 39 | } 40 | } -------------------------------------------------------------------------------- /pages/index.css: -------------------------------------------------------------------------------- 1 | @import url(../vendor/normalize.css); 2 | @import url(../fonts/inter.css); 3 | @import url(../blocks/header/header.css); 4 | @import url(../blocks/header/__logo/header__logo.css); 5 | @import url(../blocks/page/page.css); 6 | @import url(../blocks/header/__lang-link/header__lang-link.css); 7 | @import url(../blocks/header/__lang-links/header__lang-links.css); 8 | @import url(../blocks/header/__lang-link/_active/header__lang-link_active.css); 9 | @import url(../blocks/root/root.css); 10 | @import url(../blocks/lead/lead.css); 11 | @import url(../blocks/lead/__caption/lead__caption.css); 12 | @import url(../blocks/lead/__image/lead__image.css); 13 | @import url(../blocks/lead/__title/lead__title.css); 14 | @import url(../blocks/lead/__subtitle/lead__subtitile.css); 15 | @import url(../blocks/intro/intro.css); 16 | @import url(../blocks/intro/__title/intro__title.css); 17 | @import url(../blocks/intro/__text/intro__text.css); 18 | @import url(../blocks/intro/__list/intro__list.css); 19 | @import url(../blocks/photo-grid/photo-grid.css); 20 | @import url(../blocks/photo-grid/__item/photo-grid__item.css); 21 | @import url(../blocks/photo-grid/__image/photo-grid__image.css); 22 | @import url(../blocks/places/places.css); 23 | @import url(../blocks/place/place.css); 24 | @import url(../blocks/place/__image/place__image.css); 25 | @import url(../blocks/place/__title/place__title.css); 26 | @import url(../blocks/place/__paragraph/place__paragraph.css); 27 | @import url(../blocks/place/__link/place__link.css); 28 | @import url(../blocks/place/__url-heading/place__url-heading.css); 29 | @import url(../blocks/place/__website/place__website.css); 30 | @import url(../blocks/cover/cover.css); 31 | @import url(../blocks/cover/__title/cover__title.css); 32 | @import url(../blocks/cover/__subtitle/cover__subtitle.css); 33 | @import url(../blocks/cover/__overlay/cover__overlay.css); 34 | @import url(../blocks/footer/footer.css); 35 | @import url(../blocks/footer/__link/footer__link.css); 36 | @import url(../blocks/footer/__copyright/footer__copyright.css); 37 | @import url(../blocks/footer/__links/footer__links.css); 38 | @import url(../blocks/intro/__span/intro__span.css); 39 | -------------------------------------------------------------------------------- /images/header-logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /vendor/normalize.css: -------------------------------------------------------------------------------- 1 | /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ 2 | 3 | /* Document 4 | ========================================================================== */ 5 | 6 | /** 7 | * 1. Correct the line height in all browsers. 8 | * 2. Prevent adjustments of font size after orientation changes in iOS. 9 | */ 10 | 11 | html { 12 | line-height: 1.15; /* 1 */ 13 | -webkit-text-size-adjust: 100%; /* 2 */ 14 | } 15 | 16 | /* Sections 17 | ========================================================================== */ 18 | 19 | /** 20 | * Remove the margin in all browsers. 21 | */ 22 | 23 | body { 24 | margin: 0; 25 | } 26 | 27 | /** 28 | * Render the `main` element consistently in IE. 29 | */ 30 | 31 | main { 32 | display: block; 33 | } 34 | 35 | /** 36 | * Correct the font size and margin on `h1` elements within `section` and 37 | * `article` contexts in Chrome, Firefox, and Safari. 38 | */ 39 | 40 | h1 { 41 | font-size: 2em; 42 | margin: 0.67em 0; 43 | } 44 | 45 | /* Grouping content 46 | ========================================================================== */ 47 | 48 | /** 49 | * 1. Add the correct box sizing in Firefox. 50 | * 2. Show the overflow in Edge and IE. 51 | */ 52 | 53 | hr { 54 | box-sizing: content-box; /* 1 */ 55 | height: 0; /* 1 */ 56 | overflow: visible; /* 2 */ 57 | } 58 | 59 | /** 60 | * 1. Correct the inheritance and scaling of font size in all browsers. 61 | * 2. Correct the odd `em` font sizing in all browsers. 62 | */ 63 | 64 | pre { 65 | font-family: monospace, monospace; /* 1 */ 66 | font-size: 1em; /* 2 */ 67 | } 68 | 69 | /* Text-level semantics 70 | ========================================================================== */ 71 | 72 | /** 73 | * Remove the gray background on active links in IE 10. 74 | */ 75 | 76 | a { 77 | background-color: transparent; 78 | } 79 | 80 | /** 81 | * 1. Remove the bottom border in Chrome 57- 82 | * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. 83 | */ 84 | 85 | abbr[title] { 86 | border-bottom: none; /* 1 */ 87 | text-decoration: underline; /* 2 */ 88 | text-decoration: underline dotted; /* 2 */ 89 | } 90 | 91 | /** 92 | * Add the correct font weight in Chrome, Edge, and Safari. 93 | */ 94 | 95 | b, 96 | strong { 97 | font-weight: bolder; 98 | } 99 | 100 | /** 101 | * 1. Correct the inheritance and scaling of font size in all browsers. 102 | * 2. Correct the odd `em` font sizing in all browsers. 103 | */ 104 | 105 | code, 106 | kbd, 107 | samp { 108 | font-family: monospace, monospace; /* 1 */ 109 | font-size: 1em; /* 2 */ 110 | } 111 | 112 | /** 113 | * Add the correct font size in all browsers. 114 | */ 115 | 116 | small { 117 | font-size: 80%; 118 | } 119 | 120 | /** 121 | * Prevent `sub` and `sup` elements from affecting the line height in 122 | * all browsers. 123 | */ 124 | 125 | sub, 126 | sup { 127 | font-size: 75%; 128 | line-height: 0; 129 | position: relative; 130 | vertical-align: baseline; 131 | } 132 | 133 | sub { 134 | bottom: -0.25em; 135 | } 136 | 137 | sup { 138 | top: -0.5em; 139 | } 140 | 141 | /* Embedded content 142 | ========================================================================== */ 143 | 144 | /** 145 | * Remove the border on images inside links in IE 10. 146 | */ 147 | 148 | img { 149 | border-style: none; 150 | } 151 | 152 | /* Forms 153 | ========================================================================== */ 154 | 155 | /** 156 | * 1. Change the font styles in all browsers. 157 | * 2. Remove the margin in Firefox and Safari. 158 | */ 159 | 160 | button, 161 | input, 162 | optgroup, 163 | select, 164 | textarea { 165 | font-family: inherit; /* 1 */ 166 | font-size: 100%; /* 1 */ 167 | line-height: 1.15; /* 1 */ 168 | margin: 0; /* 2 */ 169 | } 170 | 171 | /** 172 | * Show the overflow in IE. 173 | * 1. Show the overflow in Edge. 174 | */ 175 | 176 | button, 177 | input { /* 1 */ 178 | overflow: visible; 179 | } 180 | 181 | /** 182 | * Remove the inheritance of text transform in Edge, Firefox, and IE. 183 | * 1. Remove the inheritance of text transform in Firefox. 184 | */ 185 | 186 | button, 187 | select { /* 1 */ 188 | text-transform: none; 189 | } 190 | 191 | /** 192 | * Correct the inability to style clickable types in iOS and Safari. 193 | */ 194 | 195 | button, 196 | [type="button"], 197 | [type="reset"], 198 | [type="submit"] { 199 | -webkit-appearance: button; 200 | } 201 | 202 | /** 203 | * Remove the inner border and padding in Firefox. 204 | */ 205 | 206 | button::-moz-focus-inner, 207 | [type="button"]::-moz-focus-inner, 208 | [type="reset"]::-moz-focus-inner, 209 | [type="submit"]::-moz-focus-inner { 210 | border-style: none; 211 | padding: 0; 212 | } 213 | 214 | /** 215 | * Restore the focus styles unset by the previous rule. 216 | */ 217 | 218 | button:-moz-focusring, 219 | [type="button"]:-moz-focusring, 220 | [type="reset"]:-moz-focusring, 221 | [type="submit"]:-moz-focusring { 222 | outline: 1px dotted ButtonText; 223 | } 224 | 225 | /** 226 | * Correct the padding in Firefox. 227 | */ 228 | 229 | fieldset { 230 | padding: 0.35em 0.75em 0.625em; 231 | } 232 | 233 | /** 234 | * 1. Correct the text wrapping in Edge and IE. 235 | * 2. Correct the color inheritance from `fieldset` elements in IE. 236 | * 3. Remove the padding so developers are not caught out when they zero out 237 | * `fieldset` elements in all browsers. 238 | */ 239 | 240 | legend { 241 | box-sizing: border-box; /* 1 */ 242 | color: inherit; /* 2 */ 243 | display: table; /* 1 */ 244 | max-width: 100%; /* 1 */ 245 | padding: 0; /* 3 */ 246 | white-space: normal; /* 1 */ 247 | } 248 | 249 | /** 250 | * Add the correct vertical alignment in Chrome, Firefox, and Opera. 251 | */ 252 | 253 | progress { 254 | vertical-align: baseline; 255 | } 256 | 257 | /** 258 | * Remove the default vertical scrollbar in IE 10+. 259 | */ 260 | 261 | textarea { 262 | overflow: auto; 263 | } 264 | 265 | /** 266 | * 1. Add the correct box sizing in IE 10. 267 | * 2. Remove the padding in IE 10. 268 | */ 269 | 270 | [type="checkbox"], 271 | [type="radio"] { 272 | box-sizing: border-box; /* 1 */ 273 | padding: 0; /* 2 */ 274 | } 275 | 276 | /** 277 | * Correct the cursor style of increment and decrement buttons in Chrome. 278 | */ 279 | 280 | [type="number"]::-webkit-inner-spin-button, 281 | [type="number"]::-webkit-outer-spin-button { 282 | height: auto; 283 | } 284 | 285 | /** 286 | * 1. Correct the odd appearance in Chrome and Safari. 287 | * 2. Correct the outline style in Safari. 288 | */ 289 | 290 | [type="search"] { 291 | -webkit-appearance: textfield; /* 1 */ 292 | outline-offset: -2px; /* 2 */ 293 | } 294 | 295 | /** 296 | * Remove the inner padding in Chrome and Safari on macOS. 297 | */ 298 | 299 | [type="search"]::-webkit-search-decoration { 300 | -webkit-appearance: none; 301 | } 302 | 303 | /** 304 | * 1. Correct the inability to style clickable types in iOS and Safari. 305 | * 2. Change font properties to `inherit` in Safari. 306 | */ 307 | 308 | ::-webkit-file-upload-button { 309 | -webkit-appearance: button; /* 1 */ 310 | font: inherit; /* 2 */ 311 | } 312 | 313 | /* Interactive 314 | ========================================================================== */ 315 | 316 | /* 317 | * Add the correct display in Edge, IE 10+, and Firefox. 318 | */ 319 | 320 | details { 321 | display: block; 322 | } 323 | 324 | /* 325 | * Add the correct display in all browsers. 326 | */ 327 | 328 | summary { 329 | display: list-item; 330 | } 331 | 332 | /* Misc 333 | ========================================================================== */ 334 | 335 | /** 336 | * Add the correct display in IE 10+. 337 | */ 338 | 339 | template { 340 | display: none; 341 | } 342 | 343 | /** 344 | * Add the correct display in IE 10. 345 | */ 346 | 347 | [hidden] { 348 | display: none; 349 | } -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | Путешествия по России 11 | 12 | 13 |
14 |
15 | 16 | 20 |
21 |
22 |
23 |

Путешествия по России

24 |

Настоящая страна не в выпусках новостей, а здесь.

25 | Вид с верхней полки поезда 26 |

ваша полка — верхняя

27 |
28 |
29 |

Чего мы там не видели?

30 |

По опросам ВЦИОМ, 95% россиян мечтают куда-нибудь поехать, но только 36% 31 | планируют 32 | провести отпуск в родной стране. Мол, чего мы тут, дома, не видели? На самом деле, Россия — это 33 | целая 34 | вселенная с ласковым морем юга, густыми лесами Саян и суровыми льдами плато Путорана. А ещё увидеть 35 | все 36 | эти красоты можно без миллионов на счету, загранпаспорта и многочасовых перелетов. Как, например, 37 | Вера 38 | Башмакова — смелая молодая мама, которая взяла в охапку троих детей, усадила их в свою «Ладу» и 39 | проехала 40 | 20 тысяч километров по родной стране. Мы выбрали и описали некоторые интересные места, достойные 41 | вашего 42 | отпуска.

43 |
    44 |
  • Часовых поясов 11
  • 45 |
  • Объектов природного наследия ЮНЕСКО 12
  • 46 |
  • Объектов культурного наследия ЮНЕСКО 16
  • 47 |
  • Природных заповедников 105
  • 48 |
  • Аэропортов 241
  • 49 |
50 |
51 |
52 | Вид из поезда 54 | Горы Атарвы 56 | Туман 58 | Вид на Сочи 60 | Ариса 62 | Байкал 64 | Горы Эльбруса 66 | Работа фотографа Станислава Кондратьева 68 | Камчатка 70 | Другой вид на Камчатку 72 | Другой вид на Байкал 74 | Эргаки 76 |
77 |
78 |
79 |

Куршская коса

80 |
81 |

URL

82 | park-kosa.ru 83 |
84 | Куршская коса 85 |
86 |

Здесь, посреди лесов и песчаных дюн, вы сможете увидеть два водных 87 | горизонта — спокойного Куршского залива с одной стороны и подёрнутого рябью волн Балтийского 88 | моря с другой. Уникальная природная зона на краю российского анклава.

89 |

На этом Калининградская область не заканчивается. Для 90 | путешественника и 91 | исследователя там же по соседству — самая западная точка России, Балтийская коса, — и 92 | немецкое 93 | наследие россыпи небольших приморских городов. Атмосфера здешних мест исключает суету, 94 | окуная в 95 | спокойствие природы и запах стального, прохладного моря.

96 |
97 |
98 |
99 |

Кольский

100 |
101 |

URL

102 | National 104 | Geographic 105 |
106 | Кольский 107 |
108 |

Почти весь полуостров находится за Полярным кругом. Саамская тундра, от 109 | которой на юг — 110 | тайга, а на север — Ледовитый океан, прикидывающийся Баренцевым морем.

111 |

Возможно, вы смотрели Звягинцева и даже слышали историю арктического 112 | фестиваля в Териберке. Возможно, слово «Хибины» не осталось под снегом школьных воспоминаний об 113 | уроках географии. Возможно, вы не интересовались пронизывающей земную кору сверхглубокой 114 | скважиной, а от апатитов вас давно накрывает апатия. Но ваша мечта увидеть северное сияние 115 | начинает сбываться с билетом 116 | в Мурманск.

117 |
118 |
119 |
120 |

Алтай

121 |
122 |

URL

123 | Facebook 125 |
126 | Алтай 127 |
128 |

Алтай — одно из красивейших мест в России. 129 | В первую очередь из-за гор: если ехать вдоль хребта, вы увидите склоны, усыпанные соснами, 130 | горные реки и озёра. А если вы откроете в автомобиле окна, сможете познакомиться с невидимым 131 | чудом здешних мест — горным воздухом.

132 |

Климат на Алтае умеренный, поэтому ехать сюда лучше всего летом. Так вы 133 | увидите всё разнообразие местной флоры и фауны. По лесам Алтая бродят лоси, над хребтами летают 134 | орлы, а на равнинах пасутся косули. И знаменитые манулы — тоже обитатели Алтайского края.

135 |
136 |
137 |
138 |

Зимний Байкал

139 |
140 |

URL

141 | https://vk.com/baikalmile 143 |
144 | Зимний Байкал 145 |
146 |

Всем известен Байкал как крупнейшее озеро 147 | в мире. Многие также знают, что это самый большой источник пресной воды и одно из красивейших 148 | мест в России.

149 |

Конечно, это всё так. Но Байкал ещё идеальное место для соревнований по 150 | скийорингу. Это такой вид спорта, когда лыжник привязывает себя 151 | к мотоциклу, и тандем старается развить как можно бóльшую скорость на льду. В марте 2019 года на 152 | фестивале «Байкальская миля» был поставлен мировой рекорд — 197.011 км/ч.

153 |
154 |
155 |
156 |

Карелия

157 |
158 |

URL

159 | http://vodlozero.ru/ 160 |
161 | Карелия 162 |
163 |

Сибирь заканчивается не на Урале, а в 164 | Карелии: образующая тайгу сибирская лиственница не растёт западнее Водлозера. Зато здесь она 165 | вымахивает на 30 метров — леса карельских национальных парков из-за непроходимых болот никогда 166 | не знали топора. Некоторым соснам уже больше чем полтысячелетия. Прикоснитесь к живому существу, 167 | видевшему солнце раньше, чем увидал его Иван Грозный. 168 | В девственном лесу на сотню километров не встретишь тропы. А на редких тропинках деревья 169 | в паре метров от земли помечены медвежьими когтями. Чтобы все знали, кто тут хозяин.

170 |
171 |
172 |
173 |
174 | 175 |
176 |

До Байкала «на собаках»

177 |

По мотивам учебной темы о Транссибе — путешествие от столицы до Байкала на 178 | электричках. 179 |

180 |
181 |
182 |
183 | 195 |
196 | 197 | --------------------------------------------------------------------------------