@charset "UTF-8";
html {
  height: 100%;
}

body {
  font-size: 1em;
  overflow-x: hidden;
  height: 100%;
}

a:link {
  color: #0055cc;
}

a:visited {
  color: #990099;
}

.header {
  /* Шапка сайта */
  position: fixed;
  top: 0;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  height: 3em;
  width: 100%;
  z-index: 20;
  background-color: #444444;
}

.mobile-menu-switcher {
  /* Включатель мобильного меню */
  display: none;
  height: 3em;
  width: 3em;
  margin: 0 0 0 0.5em;
  cursor: pointer;
  background: url(/images/icons.svg#cross) no-repeat center;
  background-size: 3em;
}
@media screen and (max-width: 767px) {
  .mobile-menu-switcher {
    /* Включатель мобильного меню виден только в «мобильном» устройстве */
    display: inline-block;
  }
}
.mobile-menu-switcher.closed {
  /* Включатель мобильного меню закрыт */
  background: url(/images/icons.svg#mobile-menu-burger-highlighted) no-repeat center;
}

.mobile-menu {
  /* Мобильное меню */
  position: fixed;
  top: 3em;
  width: 100%;
  background-color: #444444;
  height: 3em;
  transition: height 0.1s;
  transition-delay: 0.05s;
  z-index: 20;
  text-align: center;
  overflow-y: hidden;
  overflow-x: auto;
  scrollbar-width: none;
  /* Скрывает полосу прокрутки в Firefox */
  -ms-overflow-style: none;
  /* Скрывает полосу прокрутки в IE 10+ */
  -webkit-overflow-scrolling: touch;
  /* для Safari-iOS */
}
.mobile-menu.hidden {
  height: 0;
}
.mobile-menu::-webkit-scrollbar {
  /* Скрывает полосу прокрутки в Chrome based */
  width: 0;
  background: transparent;
}

.mobile-menu .sliding-block {
  display: inline-block;
  position: relative;
  white-space: nowrap;
  padding: 0.6em 1.5em 0 1.5em;
}

.mobile-menu-item {
  position: relative;
  display: inline-block;
  padding: 0 0.5em;
  margin: 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-style: normal;
  font-size: 1.125em;
}
.mobile-menu-item a {
  text-decoration: none;
  color: #888888;
}
.mobile-menu-item.highlighted, .mobile-menu-item.highlighted a {
  color: white;
}

.menu-logotype {
  /* Логотип в шапке */
  display: inline-block;
  position: relative;
  bottom: 0.5em;
  margin: 0 0.3em 0 1.33em;
  font-family: "PT Serif", "Times New Roman", Times, serif;
  font-size: 1.5em;
  font-weight: bold;
  font-style: normal;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .menu-logotype {
    margin: 0 0.3em 0 0.3em;
  }
}
.menu-logotype a {
  text-decoration: none;
  color: white;
}

.menu-item {
  /* Текcтовые пункты меню */
  position: relative;
  bottom: 0.6625em;
  display: inline-block;
  margin: 0 0.3em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-style: normal;
  font-size: 1.125em;
}
@media screen and (max-width: 767px) {
  .menu-item {
    /* Текcтовые пункты меню не видны в «мобильном» устройстве */
    display: none;
  }
}
.menu-item a {
  text-decoration: none;
  color: #888888;
}
.menu-item a:hover {
  color: white;
}
.menu-item.highlighted, .menu-item.highlighted a {
  color: white;
}

.search {
  /* Лупа */
  display: inline-block;
  height: 3em;
  width: 3em;
  margin: 0 1.25em 0 0;
  background: url(/images/icons.svg#magnifier) no-repeat 0;
  background-size: 3em;
  cursor: pointer;
}
.search.highlighted {
  background-image: url(/images/icons.svg#magnifier-highlighted);
}
.search:hover {
  background-image: url(/images/icons.svg#magnifier-highlighted);
}
@media screen and (max-width: 767px) {
  .search {
    /* Лупа в «мобильном» устройстве */
    margin: 0 0.5em 0 0;
    background-image: url(/images/icons.svg#magnifier-highlighted);
  }
}
.search a {
  /* Ссылка для лупы */
  height: 3em;
  width: 3em;
  display: block;
}

.share-menu-switcher {
  /* Выключатель делилки при открытой делилке */
  position: fixed;
  top: 3.8em;
  right: 1.25em;
  display: block;
  height: 3em;
  width: 3em;
  z-index: 10;
  border-radius: 1.5em 1.5em 0 0;
  /* Переход в состояние при открытой делилке */
  transition: border-radius 0s;
  transition-delay: 0.05s;
  background: #444444 url(/images/icons.svg#cross) no-repeat center;
  background-size: 3em;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .share-menu-switcher {
    /* Для «мобильных» устройств поля меньше */
    right: 0.5em;
  }
}

.share-menu-switcher.closed {
  /* Выключатель делилки при закрытой делилке */
  background: white url(/images/icons.svg#share) no-repeat center;
  background-size: 3em;
  /* Переход в состояние при закрытой делилке */
  border-radius: 1.5em;
  transition: border-radius 0s;
  transition-delay: 0.25s;
}
.share-menu-switcher.closed:hover {
  background: #444444 url(/images/icons.svg#share-highlighted) no-repeat center;
  background-size: 3em;
}
@media screen and (max-width: 767px) {
  .share-menu-switcher.closed {
    background: white url(/images/icons.svg#share) no-repeat center;
    background-size: 3em;
  }
}

.share-menu {
  /* Делилка */
  position: fixed;
  top: 6.8em;
  right: 1.25em;
  width: 3em;
  height: 15em;
  border-radius: 0 0 1.5em 1.5em;
  overflow: hidden;
  z-index: 10;
  font-size: 1em;
  transition: height 0.2s;
  transition-delay: 0.05s;
}
@media screen and (max-width: 767px) {
  .share-menu {
    /* Для «мобильных» устройств поля меньше */
    right: 0.5em;
  }
}
.share-menu.hidden {
  /* Делилка скрыта */
  height: 0;
}
.share-menu .sliding-block {
  /* Сдвигаемый блок в делилке */
  display: block;
  position: absolute;
  bottom: 0;
}

.share-menu-item {
  /* Кнопки в меню делилки */
  display: block;
  height: 3em;
  width: 3em;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 3em;
  cursor: pointer;
}
.share-menu-item:hover {
  /* Кнопки в меню делилки при наведении курсора */
  background-size: 4em;
}
.share-menu-item a {
  /* Свойства ссылки в меню делилки */
  display: block;
  height: 100%;
  width: 100%;
}

/* Ссылки в кнопках в меню делилки: */
#facebook-share-button {
  background-image: url(/images/icons.svg#facebook-share-button);
}

#vk-share-button {
  background-image: url(/images/icons.svg#vk-share-button);
}

#telegram-share-button {
  background-image: url(/images/icons.svg#telegram-share-button);
}

#twitter-share-button {
  background-image: url(/images/icons.svg#twitter-share-button);
}

#pinterest-share-button {
  background-image: url(/images/icons.svg#pinterest-share-button);
}

.more-switcher-point {
  /* Место для кнопки «+Ещё» */
  position: relative;
}

.more-works-switcher-mask {
  /* Подложка под кнопку «+Ещё» */
  position: absolute;
  top: 0.95em;
  left: 0.95em;
  width: 8em;
  height: 2.625em;
  z-index: 12;
  /* Начальное состояние — подложка прозрачная */
  opacity: 0;
  background-color: white;
  transition: opacity 0.4s;
  transition-delay: 0.05s;
}
@media screen and (max-width: 767px) {
  .more-works-switcher-mask {
    /* Для «мобильных» устройств поля меньше */
    left: 0.7em;
  }
}
.more-works-switcher-mask.opaque {
  /* Становится непрозрачной */
  opacity: 1;
}

.more-works-switcher {
  /* Кнопка «+Ещё» */
  position: absolute;
  top: 1.2em;
  left: 1.2em;
  display: flex;
  align-items: center;
  z-index: 12;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .more-works-switcher {
    /* Для «мобильных» устройств логотип в другом месте,
    поэтому кнопка «+Ещё» выравнивается по-другому */
    left: 0.95em;
  }
}
.more-works-switcher > .plus {
  /* Плюс внутри открытой кнопки «+Ещё» */
  display: inline-block;
  width: 2.125em;
  height: 2.125em;
  background: url(/images/icons.svg#more-plus) no-repeat center;
  background-size: 2.125em;
  transform: rotate(45deg);
  transition: transform 0.1s;
  transition-delay: 0.2s;
}
.more-works-switcher.closed > .plus {
  /* Плюс внутри закрытой кнопки «+Ещё» */
  transform: rotate(0deg);
}
.more-works-switcher.white-on-color.closed > .plus {
  /* Плюс внутри закрытой кнопки «+Ещё» на цветном фоне */
  background-image: url(/images/icons.svg#more-plus-white);
}
.more-works-switcher > .more-text {
  /* «Ещё» внутри кнопки «+Ещё» */
  display: none;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 1em;
  margin-left: 0.75em;
}
.more-works-switcher.closed > .more-text {
  /* Текст «Ещё» внутри закрытой кнопки «+Ещё» */
  display: inline-block;
  color: black;
}
.more-works-switcher.white-on-color.closed > .more-text {
  /* Текст «Ещё» внутри закрытой кнопки «+Ещё» на цветном фоне */
  color: white;
}
.more-works-switcher > .close-text {
  /* Текст «Закрыть» внутри кнопки «+Ещё» */
  display: inline-block;
  margin-left: 0.5em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 1em;
}
.more-works-switcher.closed > .close-text {
  /* Текст «Закрыть» внутри закрытой кнопки «+Ещё» */
  display: none;
}

.more-menu {
  /* Доп. работы */
  position: relative;
  width: 100%;
  height: 20em;
  margin-bottom: -3em;
  z-index: 11;
  overflow: hidden;
  background-color: white;
  /* Переход не только на высоту, но и на нижнее поле. Если только на
  высоту, то вначале получается скачок вверх на размер нижнего поля */
  transition: all 0.3s 0.05s;
  text-align: center;
}
.more-menu.hidden {
  height: 0;
  margin-bottom: 0;
}
.more-menu::-webkit-scrollbar {
  width: 0;
  background: transparent;
}

.more-menu .sliding-block {
  /* Сдвигаемый блок в доп. работах */
  position: absolute;
  bottom: 0;
  display: flex;
  width: 100%;
  height: 20em;
  overflow-y: hidden;
  padding: 1.5em 0 0 1.5em;
  scrollbar-width: none;
  /* Скрывает полосу прокрутки в Firefox */
  -ms-overflow-style: none;
  /* Скрывает полосу прокрутки в IE 10+ */
  -webkit-overflow-scrolling: touch;
  /* для Safari-iOS */
}
.more-menu .sliding-block::-webkit-scrollbar {
  /* Скрывает полосу прокрутки в Chrome based */
  display: none;
  height: 0;
  width: 0;
  background: transparent;
}

.more-menu {
  /* Доп. работы и стрелки в них */
}
.more-menu > .backward-arrow, .more-menu > .forward-arrow {
  /* Стрелки, общие свойства */
  position: absolute;
  bottom: 11em;
  width: 3em;
  height: 3em;
  cursor: pointer;
}
.more-menu > .backward-arrow {
  /* Обратная стрелка */
  left: -3em;
  background: white url(/images/icons.svg#backward-arrow) center no-repeat;
  background-size: 2.125em;
  transition: left 0.2s;
}
.more-menu > .backward-arrow:hover {
  background: #444444 url(/images/icons.svg#backward-arrow-highlighted) center no-repeat;
  background-size: 2.125em;
}
.more-menu > .forward-arrow {
  /* Cтрелка */
  right: -3em;
  background: white url(/images/icons.svg#forward-arrow) no-repeat center;
  background-size: 2.125em;
  transition: right 0.2s;
}
.more-menu > .forward-arrow:hover {
  background: #444444 url(/images/icons.svg#forward-arrow-highlighted) no-repeat center;
  background-size: 2.125em;
}
.more-menu > .backward-arrow.hidden, .more-menu > .forward-arrow.hidden {
  /* Стрелки скрыты по умолчанию */
  display: none;
}
.more-menu:hover > .backward-arrow {
  /* Если навести курсор на всё выдвижное меню,
  показывается кнопка с обратной стрелкой */
  left: 0;
}
.more-menu:hover > .forward-arrow {
  /* Если навести курсор на всё выдвижное меню,
  показывается кнопка со стрелкой */
  right: 0;
}

.more-menu-item {
  /* Элемент выдвижного меню */
  display: block;
  width: 20em;
  height: 18.5em;
  padding: 0 1.5em 0 0;
  overflow: hidden;
  flex: 0 0 20em;
}
.more-menu-item:first-of-type {
  /* Левый отступ у первого и последнего элементов выдвижного меню.
  Это имитация "justify-content: center". Потому что если написать
  "justify-content: center", то неправильно отображается прокрутка. */
  margin-left: auto;
}
.more-menu-item:last-of-type {
  margin-right: auto;
}
.more-menu-item a {
  /* Сыылка внутри элемента выдвижного меню (контейнер для картинки) */
  display: block;
}
.more-menu-item img, .more-menu-item video {
  /* Картинка внутри элемента выдвижного меню */
  display: block;
  width: 100%;
  height: 66.667%;
}
.more-menu-item h3 {
  /* Заголовок внутри элемента... */
  margin: 0.7em 0 0 0;
  font-family: "PT Sans", Arial, Helvetica, sans-serif;
  font-size: 1.1em;
  font-weight: normal;
  white-space: normal;
  text-align: left;
  line-height: 1.4;
  color: #888888;
}
.more-menu-item h3 a {
  color: #888888;
  text-decoration: none;
}

.more-menu .swiper-container {
  /* Сдвигаемый слайдер в доп. работах */
  position: absolute;
  top: auto;
  bottom: 0;
  width: 100%;
  height: 20em;
  overflow: hidden;
  padding: 1.5em 0 0 1.5em;
}

.more-menu .swiper-slide {
  width: auto;
}
.more-menu .swiper-slide:first-of-type {
  /* Левый отступ у первого и последнего элементов выдвижного меню.
  Это имитация "justify-content: center" */
  margin-left: auto;
}
.more-menu .swiper-slide:last-of-type {
  margin-right: auto;
}

.more-menu {
  /* Доп. работы и стрелки в них */
}
.more-menu .swiper-button-prev, .more-menu .swiper-button-next {
  /* Стрелки, общие свойства */
  position: absolute;
  top: auto;
  bottom: 11em;
  width: 3em;
  height: 3em;
  cursor: pointer;
}
.more-menu .swiper-button-prev::after, .more-menu .swiper-button-next::after {
  content: "";
}
.more-menu .swiper-button-prev {
  /* Обратная стрелка */
  left: -3em;
  background: white url(/images/icons.svg#backward-arrow) center no-repeat;
  background-size: 2.125em;
  transition: left 0.2s;
}
.more-menu .swiper-button-prev:hover {
  background: #444444 url(/images/icons.svg#backward-arrow-highlighted) center no-repeat;
  background-size: 2.125em;
}
.more-menu .swiper-button-next {
  /* Cтрелка */
  right: -3em;
  background: white url(/images/icons.svg#forward-arrow) no-repeat center;
  background-size: 2.125em;
  transition: right 0.2s;
}
.more-menu .swiper-button-next:hover {
  background: #444444 url(/images/icons.svg#forward-arrow-highlighted) no-repeat center;
  background-size: 2.125em;
}
.more-menu:hover .swiper-button-prev {
  /* Если навести курсор на всё выдвижное меню,
  показывается кнопка с обратной стрелкой */
  left: 0;
}
.more-menu:hover .swiper-button-prev.swiper-button-disabled {
  left: -3em;
  opacity: 1;
}
.more-menu:hover .swiper-button-next {
  /* Если навести курсор на всё выдвижное меню,
  показывается кнопка со стрелкой */
  right: 0;
}
.more-menu:hover .swiper-button-next.swiper-button-disabled {
  right: -3em;
  opacity: 1;
}

.spacer-1 {
  height: 3em;
}

.spacer-2 {
  height: 100%;
  max-height: calc(100vw + 3em);
}

.spacer-3 {
  height: 3em;
}

.spacer-4 {
  height: 0.5em;
}

.spacer-5 {
  height: 1.5em;
}

.spacer-6 {
  height: 1em;
}

.content {
  /* Контейнер основного содержания */
  width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  text-align: center;
}
.content.main {
  /* Контейнер основного содержания на главной странице */
  position: relative;
  background-color: white;
  z-index: 3;
  min-height: calc(100% - 3em);
}
.content.backdrop {
  /* Контейнер основного содержания с «подложкой» —
  для страниц, где цветная подложка с картинкой */
  position: relative;
  overflow: hidden;
}

.content {
  /* Контейнер основного содержания и колонка в нём */
}
.content > .column-3, .content > .column-4 {
  /* Колонки для содержания, старая и новая, общие свойства */
  display: inline-block;
  text-align: left;
  width: 100%;
  padding: 0 2em;
}
.content > .column-3 {
  /* Колонка для содержания как на прежнем сайте */
  max-width: 56.25em;
}
.content > .column-4 {
  /* Колонка для содержания для новых работ, немного пошире прежней */
  max-width: 60.25em;
}

h1 {
  /* Заголовки страниц */
  width: 100%;
  margin: 0;
  font-family: "PT Serif", "Times New Roman", Times, serif;
  font-weight: normal;
  text-align: center;
  line-height: 1.2;
}
h1.story {
  /* Заголовок истории в блоге */
  padding-top: 1em;
  font-size: 2.25em;
}
h1.work {
  /* Заголовок работы */
  padding-top: 1.5em;
  font-size: 2.8em;
}
h1.catalogue {
  /* Заголовок каталога */
  padding-top: 0.4em;
  font-size: 3.25em;
}
@media screen and (max-width: 900px) {
  h1.catalogue {
    font-size: 2.8em;
  }
}

h2 {
  /* Подзаголовок в тексте работы */
  font-family: "PT Serif", "Times New Roman", Times, serif;
  font-weight: normal;
  font-size: 1.5em;
  line-height: 1.5;
  text-align: left;
  margin: 0.5em 0;
}

p {
  /* Текст описания работы по-старому */
  font-family: "PT Serif", "Times New Roman", Times, serif;
  font-size: 1.125em;
  line-height: 1.5;
  margin: 0;
  position: relative;
}
p.v2 {
  /* Текст описания работы по-новому */
  font-size: 1.25em;
  line-height: 1.4;
}
p.signature-2 {
  /* Подпись под картинкой в виде узкой колонки */
  width: 100%;
  max-width: 26.125em;
  margin: 0.5em 0 0 0;
  font-size: 1em;
  font-style: italic;
}
p.signature-2.in-the-center {
  margin-right: auto;
  margin-left: auto;
}
p.signature-3 {
  /* Подпись под картинкой отцентрированная */
  margin: 0.5em 0 0 0;
  font-size: 1em;
  font-style: italic;
  text-align: center;
}

p.info {
  /* Подзаголовок работы и поста блога */
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  text-align: center;
  color: #999999;
  font-size: 0.9em;
  line-height: 1.2;
  padding: 1.5em 0 2.25em 0;
  clear: both;
}

p.objective {
  /* Описание задачи в посте блога */
  display: inline-block;
  padding: 0 0 0.75em 0;
  border-bottom: 0.3em solid #cccccc;
  max-width: 35em;
}

.content.backdrop {
  /* Колонка содержания на цветной подложке */
}
.content.backdrop .column-4 {
  z-index: 1;
  position: relative;
}
.content.backdrop.white-on-color .column-4 {
  /* Текст на цветной подложке */
}
.content.backdrop.white-on-color .column-4 h1, .content.backdrop.white-on-color .column-4 h2, .content.backdrop.white-on-color .column-4 h3, .content.backdrop.white-on-color .column-4 p, .content.backdrop.white-on-color .column-4 p a {
  color: white;
}
.content.backdrop.white-on-color .column-4 p.info .date {
  /* Дата в подзаголовке работы на подложке */
  opacity: 0.67;
}

.image-switcher .images > * {
  display: none;
}

.image-switcher > .thumbnails {
  font-size: 0;
}

.image-switcher .thumbnails > div {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

.image-switcher .thumbnails > div > div {
  width: inherit;
  height: inherit;
}

.image-switcher .thumbnails > div > .selected {
  position: absolute;
  display: none;
}

.image-switcher.type-01 {
  text-align: center;
}
.image-switcher.type-01 > .images {
  width: 100%;
}
.image-switcher.type-01 > .images > img {
  margin: auto;
}
.image-switcher.type-01 > .thumbnails {
  margin: 12px auto 0 auto;
}

.image-switcher.type-02 {
  text-align: center;
}
.image-switcher.type-02 > .images {
  width: 100%;
}
.image-switcher.type-02 > .images > div {
  margin: auto;
}
.image-switcher.type-02 > .thumbnails {
  margin: 24px auto 0 auto;
}

.content > .column-5 {
  display: block;
  width: 100%;
  margin: 0 auto;
  max-width: 128em;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-5 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-5 {
    padding: 0;
  }
}
.content > .column-5 > img {
  display: block;
  width: 50%;
  margin: auto;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 1400px) {
  .content > .column-5 > img {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-5 > img {
    padding: 0.5em 0;
  }
}

.content > .column-6 {
  /*
  В широком окне: 3 картинки в ряду.
  Ряд по ширине не ограничен.
  В узком окне: слайдер.
  */
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-6 {
    max-width: 60.25em;
    padding: 0 2em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-6 {
    padding: 0;
  }
}
.content > .column-6 > img {
  /* Картинки без слайдера */
  display: block;
  width: 33.33%;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 1400px) {
  .content > .column-6 > img {
    /* Скрытие обычных картинок при узком окне */
    display: none;
  }
}
.content > .column-6 > .swiper-container {
  /* Слайдер */
  display: none;
  overflow: hidden;
}
@media screen and (max-width: 1400px) {
  .content > .column-6 > .swiper-container {
    /* Появление слайдера при узком окне */
    display: block;
  }
}

.content > .column-8 {
  /*
  В широком окне: 1 картинка в ряду.
  Ряд ограничен по ширине 128 em — подходит для 1 гориз. картинки.
  В узком окне: 1 картинка в ряду.
  */
  display: block;
  margin: 0 auto;
  width: 100%;
  /* С учётом остальных полей ширина оставляет для картинки 2000 px */
  max-width: 128em;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-8 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-8 {
    padding: 0;
  }
}
.content > .column-8 > img {
  display: block;
  width: 100%;
  padding: 0.5em;
}
@media screen and (max-width: 767px) {
  .content > .column-8 > img {
    padding: 0.5em 0;
  }
}

.content > .column-9 {
  /*
  В широком окне, в узком окне: слайдер.
  Слайдер ограничен по ширине текстовой колонкой.
  */
  display: block;
  width: 100%;
  max-width: 60.25em;
  margin: 0 auto;
  padding: 0 2em;
}
@media screen and (max-width: 767px) {
  .content > .column-9 {
    padding: 0;
  }
}
.content > .column-9 > .swiper-container {
  overflow: hidden;
  display: block;
}

.content > .column-10 {
  /*
  В широком окне: 1 картинка в первом ряду
  2 картинки во втором ряду, 1 картинка в третьем и сл. рядах.
  Ряд ограничен по ширине 128 em — подходит для 1 гориз. картинки.
  В узком окне: 1 картинка в ряду.
  */
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.5em;
  max-width: 128em;
}
@media screen and (max-width: 1400px) {
  .content > .column-10 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-10 {
    padding: 0;
  }
}
.content > .column-10 > img {
  display: block;
  margin: auto;
  width: 100%;
  padding: 0.5em;
  float: left;
}
.content > .column-10 > img:nth-child(2), .content > .column-10 > img:nth-child(3) {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .content > .column-10 > img {
    padding: 0.5em 0;
  }
  .content > .column-10 > img:nth-child(2), .content > .column-10 > img:nth-child(3) {
    width: 100%;
  }
}

.content > .column-12 {
  /*
  В широком окне, в узком окне: слайдер.
  Ряд ограничен по ширине 128 em — подходит для 1 гориз. картинки.
  */
  display: block;
  width: 100%;
  max-width: 128em;
  margin: 0 auto;
  padding: 0 2em;
}
@media screen and (max-width: 1400px) {
  .content > .column-12 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-12 {
    padding: 0;
  }
}
.content > .column-12 > .swiper-container {
  overflow: hidden;
  display: block;
}

.content > .column-13 {
  display: block;
  width: 100%;
  max-width: 128em;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-13 {
    max-width: 60.25em;
    padding: 0 2em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-13 {
    padding: 0;
  }
}
.content > .column-13 > img {
  /* Картинки без слайдера */
  display: block;
  width: 50%;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 1400px) {
  .content > .column-13 > img {
    /* Скрытие обычных картинок при узком окне */
    display: none;
  }
}
.content > .column-13 > .swiper-container {
  /* Слайдер */
  display: none;
  overflow: hidden;
}
@media screen and (max-width: 1400px) {
  .content > .column-13 > .swiper-container {
    /* Появление слайдера при узком окне */
    display: block;
  }
}

.content > .column-14 {
  /*
  В широком окне: 4 картинки в ряду.
  В среднем окне: 2 картинки в ряду.
  Ряд по ширине не ограничен.
  В узком окне: слайдер.
  */
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-14 {
    max-width: 60.25em;
    padding: 0 2em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-14 {
    padding: 0;
  }
}
.content > .column-14 > img {
  /* Картинки без слайдера */
  display: block;
  width: 25%;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 1600px) {
  .content > .column-14 > img {
    /* Расширение картинок до 50% при окне средней ширины */
    width: 50%;
  }
}
@media screen and (max-width: 1400px) {
  .content > .column-14 > img {
    /* Скрытие обычных картинок при узком окне */
    display: none;
  }
}
.content > .column-14 > .swiper-container {
  /* Слайдер */
  display: none;
  overflow: hidden;
}
@media screen and (max-width: 1400px) {
  .content > .column-14 > .swiper-container {
    /* Появление слайдера при узком окне */
    display: block;
  }
}

.content > .column-15 {
  /*
  В широком окне: 4 картинки в ряду.
  Ряд по ширине не ограничен.
  В среднем окне: 3 картинки в ряду.
  В среднем окне: 2 картинки в ряду.
  В узком окне: 1 картинка в ряду.
  */
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-15 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-15 {
    padding: 0;
  }
}
.content > .column-15 > img {
  display: block;
  width: 25%;
  margin: auto;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 2000px) {
  .content > .column-15 > img {
    width: 33.33%;
  }
}
@media screen and (max-width: 1400px) {
  .content > .column-15 > img {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-15 > img {
    width: 100%;
    padding: 0.5em 0;
  }
}

.content > .column-16 {
  /*
  В широком окне: 1 картинка в ряду.
  Ряд ограничен по ширине 100 em — подходит для 1 верт. картинки.
  С учётом остальных полей ширина оставляет для картинки 1520 px.
  В узком окне: 1 картинка в ряду.
  */
  display: block;
  margin: 0 auto;
  width: 100%;
  max-width: 98em;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-16 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-16 {
    padding: 0;
  }
}
.content > .column-16 > img {
  display: block;
  width: 100%;
  padding: 0.5em;
}
@media screen and (max-width: 767px) {
  .content > .column-16 > img {
    padding: 0.5em 0;
  }
}

.content > .column-17 {
  /*
  В широком окне, в узком окне: слайдер.
  Ряд ограничен по ширине 98 em — подходит для 1 гориз. картинки.
  С учётом других полей ширина оставляет для картинки 1504 px.
  */
  display: block;
  width: 100%;
  max-width: 98em;
  margin: 0 auto;
  padding: 0 2em;
}
@media screen and (max-width: 1400px) {
  .content > .column-17 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-17 {
    padding: 0;
  }
}
.content > .column-17 > .swiper-container {
  overflow: hidden;
  display: block;
}

.content > .column-18 {
  /*
  В широком окне: 3 картинки в ряду.
  Ряд ограничен по ширине 128 em — как для 1 гориз. картинки.
  В узком окне: слайдер.
  */
  display: block;
  width: 100%;
  max-width: 128em;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-18 {
    max-width: 60.25em;
    padding: 0 2em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-18 {
    padding: 0;
  }
}
.content > .column-18 > img {
  /* Картинки без слайдера */
  display: block;
  width: 33.33%;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 1400px) {
  .content > .column-18 > img {
    /* Скрытие обычных картинок при узком окне */
    display: none;
  }
}
.content > .column-18 > .swiper-container {
  /* Слайдер */
  display: none;
  overflow: hidden;
}
@media screen and (max-width: 1400px) {
  .content > .column-18 > .swiper-container {
    /* Появление слайдера при узком окне */
    display: block;
  }
}

.content > .column-19 {
  /*
  В широком окне: 2 картинка в первом ряду
  3 картинки следующих рядах.
  Ряд по ширине не ограничен.
  В узком окне: 1 картинка в ряду.
  */
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-19 {
    max-width: 60.25em;
    padding: 0 2em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-19 {
    padding: 0;
  }
}
.content > .column-19 > img {
  /* Картинки без слайдера */
  display: block;
  width: 33.33%;
  padding: 0.5em;
  float: left;
}
.content > .column-19 > img:nth-child(1), .content > .column-19 > img:nth-child(2) {
  width: 50%;
}
@media screen and (max-width: 1400px) {
  .content > .column-19 > img {
    /* Скрытие обычных картинок при узком окне */
    display: none;
  }
}
.content > .column-19 > .swiper-container {
  /* Слайдер */
  display: none;
  overflow: hidden;
}
@media screen and (max-width: 1400px) {
  .content > .column-19 > .swiper-container {
    /* Появление слайдера при узком окне */
    display: block;
  }
}

.content > .column-21 {
  /*
  В широком окне: 2 картинки в ряду.
  Ряд по ширине не ограничен.
  В узком окне: 1 картинка в ряду.
  */
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-21 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-21 {
    padding: 0;
  }
}
.content > .column-21 > img {
  display: block;
  width: 33.33%;
  margin: auto;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 1400px) {
  .content > .column-21 > img {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-21 > img {
    padding: 0.5em 0;
  }
}

.content > .column-22 {
  display: block;
  width: 100%;
  margin: 0 auto;
  max-width: 128em;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-22 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-22 {
    padding: 0;
  }
}
.content > .column-22 > img {
  display: block;
  width: 50%;
  margin: auto;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 767px) {
  .content > .column-22 > img {
    width: 100%;
    padding: 0.5em 0;
  }
}

.content > .column-23 {
  /*
  В широком окне: 3 картинки в ряду.
  Ряд по ширине ограничен. 128em
  В среднем окне: 2 картинки в ряду.
  В узком окне: 1 картинка в ряду.
  */
  display: block;
  width: 100%;
  max-width: 128em;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-23 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-23 {
    padding: 0;
  }
}
.content > .column-23 > img {
  display: block;
  width: 33.33%;
  margin: auto;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 1400px) {
  .content > .column-23 > img {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-23 > img {
    width: 100%;
    padding: 0.5em 0;
  }
}

.content > .column-24 {
  /*
  В широком и среднем окне: 2 картинки в ряду.
  Ряд по ширине ограничен 128em.
  В узком окне: 1 картинка в ряду.
  */
  display: block;
  width: 100%;
  max-width: 128em;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-24 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-24 {
    padding: 0;
  }
}
.content > .column-24 > img {
  display: block;
  width: 50%;
  margin: auto;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 767px) {
  .content > .column-24 > img {
    width: 100%;
    padding: 0.5em 0;
  }
}

.content > .column-25 {
  /*
  В широком и среднем окне: 3 картинки в ряду.
  Ряд по ширине ограничен. 128em
  В среднем окне: 2 картинки в ряду.
  В узком окне: 1 картинка в ряду.
  */
  display: block;
  width: 100%;
  max-width: 128em;
  margin: 0 auto;
  padding: 0 1.5em;
}
@media screen and (max-width: 1400px) {
  .content > .column-25 {
    max-width: 60.25em;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-25 {
    padding: 0;
  }
}
.content > .column-25 > img {
  display: block;
  width: 33.33%;
  margin: auto;
  padding: 0.5em;
  float: left;
}
@media screen and (max-width: 1400px) {
  .content > .column-25 > img {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .content > .column-25 > img {
    width: 100%;
    padding: 0.5em 0;
  }
}

.content > .column-26 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  max-width: 128em;
  padding: 0.5em;
  margin: 0 auto;
}
@media screen and (max-width: 830px) {
  .content > .column-26 {
    padding: 0;
    border: #ffffff solid 1px;
  }
}
.content > .column-26 > a {
  display: block;
  width: 250px;
  margin: 0.5em;
}
@media screen and (max-width: 830px) {
  .content > .column-26 > a {
    width: 25%;
    margin: 0;
    border: #ffffff solid 1px;
  }
}
@media screen and (max-width: 599px) {
  .content > .column-26 > a {
    width: 33.33%;
  }
}
.content > .column-26 > a > img {
  display: block;
  width: 100%;
}

.swiper-container.type-1 {
  /* Слайдер для контента, тип 1 */
  position: relative;
}
.swiper-container.type-1 .swiper-slide > img {
  display: block;
  width: 100%;
}
.swiper-container.type-1 .swiper-button-prev::after, .swiper-container.type-1 .swiper-button-next::after {
  content: "";
}
.swiper-container.type-1 .swiper-button-prev {
  width: 3em;
  height: 3em;
  left: -3em;
  background: white url(/images/icons.svg#backward-arrow) center no-repeat;
  background-size: 2.125em;
  transition: left 0.2s;
}
.swiper-container.type-1 .swiper-button-prev:hover {
  background: #444444 url(/images/icons.svg#backward-arrow-highlighted) center no-repeat;
  background-size: 2.125em;
}
.swiper-container.type-1:hover .swiper-button-prev {
  left: 0;
}
.swiper-container.type-1:hover .swiper-button-prev.swiper-button-disabled {
  left: -3em;
}
.swiper-container.type-1 .swiper-button-next {
  width: 3em;
  height: 3em;
  right: -3em;
  background: white url(/images/icons.svg#forward-arrow) center no-repeat;
  background-size: 2.125em;
  transition: right 0.2s;
}
.swiper-container.type-1 .swiper-button-next:hover {
  background: #444444 url(/images/icons.svg#forward-arrow-highlighted) center no-repeat;
  background-size: 2.125em;
}
.swiper-container.type-1:hover .swiper-button-next {
  right: 0;
}
.swiper-container.type-1:hover .swiper-button-next.swiper-button-disabled {
  right: -3em;
}

.content > .column-3.comment-block {
  /* Колонка для комментариев к статьям как на прежнем сайте.
  Уменьшены боковые поля, чтобы можно стало прибавить поля
  вокруг коментариев. Снизу добавлено поле, потому что последний
  элемент — кнопка с отрицательными полями */
  padding: 0 1.25em 0.5em 1.25em;
}

.comment {
  /* Контейнер коментария */
  position: relative;
  padding: 0.75em;
}

.comment > a {
  /* Якорь коментария */
  position: absolute;
  top: -3.5em;
}

.comment > .highlighting {
  /* Подсветка комментария */
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: #e0f0ff;
  opacity: 0;
  z-index: -1;
}

.comment-content {
  /* Содержимое комментария. Пока никаких свойств
  не понадобилось */
}

.comment-userpic {
  /* Юзерпик любого автора комментария */
  position: absolute;
  width: 3.75em;
  height: 3.75em;
  background: url(/images/icons.svg#comment-author-avatar-1) no-repeat center;
  background-size: 3.75em;
}
.comment-userpic.rb {
  /* Юзерпик вебмастера */
  background-image: url(/images/icons.svg#comment-author-avatar-2);
  background-size: 3.75em;
}

.comment-headline {
  /* Заголовок комментария: никнейм автора, никнейм
  получателя (если есть), дата и время */
  display: flex;
  height: 2.5em;
  padding: 0 0 0 4.5em;
}

.comment-author {
  /* Никнейм автора комментария */
  display: block;
  max-width: 100%;
  min-width: 0;
  height: 100%;
  padding: 0.5em 0 0 0;
  overflow: hidden;
  flex: 0 1 auto;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1.125em;
  color: black;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.comment-recipient {
  /* Никнейм получателя ответа */
  position: relative;
  display: block;
  max-width: 100%;
  min-width: 0;
  height: 100%;
  padding: 0.5em 1em 0 0;
  overflow: hidden;
  flex: 0 1 auto;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1.125em;
  color: #999999;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.comment-recipient a {
  color: #999999;
}
.comment-recipient a:before {
  /* «Расширитель» сылки в никнейме получателя ответа.
  Объект во всю площадь родительского элемента.
  Помещённый внутрь ссылки, расширяет площадь ссылки
  до размеров родительского элемента. Это сделано
  для увеличения площади клика для тачпадов */
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  display: block;
}
.comment-recipient:hover, .comment-recipient:hover a {
  color: black;
}
@media screen and (max-width: 767px) {
  .comment-recipient:hover, .comment-recipient:hover a {
    color: #999999;
  }
}

.comment-recipient .respond-arrow {
  /* Стрелка на никнейм получателя ответа */
  display: inline-block;
  width: 2em;
  height: 0.75em;
  background: url(/images/icons.svg#respond-arrow-1) no-repeat center;
  background-size: 2em;
}

.comment-recipient:hover .respond-arrow {
  background-image: url(/images/icons.svg#respond-arrow-1-highlighted);
  background-size: 2em;
}
@media screen and (max-width: 767px) {
  .comment-recipient:hover .respond-arrow {
    background-image: url(/images/icons.svg#respond-arrow-1);
    background-size: 2em;
  }
}

.comment-date {
  /* Дата и время комментария */
  display: flex;
  padding: 0 0 0 5em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  font-weight: normal;
  text-align: left;
  color: #999999;
}

.comment-text {
  /* Текст комментария */
  display: block;
  margin-top: 0.5em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1em;
  line-height: 1.5;
}

.reply-button {
  /* Кнопка «Ответить» (на данный комментарий) */
  position: relative;
  display: inline-block;
  padding: 1em;
  margin: -0.83em -1em -1em -1em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  text-decoration: underline;
  font-size: 1em;
  color: #0055cc;
  cursor: pointer;
}
.reply-button:hover {
  color: black;
}
@media screen and (max-width: 767px) {
  .reply-button:hover {
    color: #0055cc;
  }
}

.new-comment-submit-button {
  /* Кнопка «Отправить» (данную форму) */
  position: relative;
  display: inline-block;
  height: 2.5em;
  padding: 0.6em 1em 0 2.25em;
  margin: 1em 0.5em 0 0;
  background: #a7ccff url(/images/icons.svg#respond-arrow-3) no-repeat left;
  background-size: 2.5em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1em;
  color: black;
  cursor: pointer;
}
.new-comment-submit-button:hover {
  background: #3366bb url(/images/icons.svg#respond-arrow-3-highlighted) no-repeat left;
  background-size: 2.5em;
  color: white;
}
@media screen and (max-width: 767px) {
  .new-comment-submit-button:hover {
    background: #a7ccff url(/images/icons.svg#respond-arrow-3) no-repeat left;
    background-size: 2.5em;
    color: black;
  }
}

.cancel-new-comment-button {
  /* Кнопка «Отменить» (отправку данной формы) */
  position: relative;
  display: inline-block;
  height: 2.5em;
  padding: 0.6em 1em 0 2.25em;
  margin: 1em 0 0 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1em;
  color: #999999;
  background: #f0f0f0 url(/images/icons.svg#cross-2) no-repeat left;
  background-size: 2.5em;
  cursor: pointer;
}
.cancel-new-comment-button:hover {
  background: #444444 url(/images/icons.svg#cross-2-highlighted) no-repeat left;
  background-size: 2.5em;
  color: white;
}
@media screen and (max-width: 767px) {
  .cancel-new-comment-button:hover {
    background: #f0f0f0 url(/images/icons.svg#cross-2) no-repeat left;
    background-size: 2.5em;
    color: #999999;
  }
}

#new-comment-form {
  /* Контейнер формы создания коментария */
  display: none;
  height: auto;
  overflow: hidden;
}

.new-comment {
  min-height: 3.9em;
  padding: 0.25em 0.25em 0.5em 0.75em;
  margin: 0.5em 0 0 0;
  border: 0.0625em solid #cccccc;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  color: #999999;
  font-size: 1em;
  line-height: 1.5;
}

.new-comment-author-name {
  max-width: 30em;
  margin: 1em 0 0 0;
  padding: 0.25em 0.25em 0.5em 0.75em;
  border: 0.0625em solid #cccccc;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1em;
  line-height: 1.5;
  color: #999999;
}
@media screen and (max-width: 767px) {
  .new-comment-author-name {
    max-width: 100em;
  }
}

.new-comment-warning {
  display: inline-flex;
  margin: 0.5em 0 0 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 0.8em;
  line-height: 1.5;
}

.empty-header {
  position: fixed;
  top: 0;
  display: flex;
  align-items: baseline;
  justify-content: right;
  height: 3em;
  width: 100%;
  background-color: white;
  z-index: 20;
}

.search-switcher {
  display: inline-block;
  height: 3em;
  width: 3em;
  margin: 0 1.25em 0 0;
  background: url(/images/icons.svg#cross-3) no-repeat 0;
  background-size: 3em;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .search-switcher {
    margin: 0 0.5em 0 0;
  }
}
.search-switcher a {
  /* Ссылка для лупы */
  height: 3em;
  width: 3em;
  display: block;
}

.spacer-11 {
  /* Отбивка переменной высоты для стр. поиска */
  height: calc(100% - 24em);
  min-height: 2em;
  max-height: 10em;
}

.search-block {
  /* Блок поиска */
  display: flex;
}

.search-field-and-prompt {
  /* Поле поиска и подсказки */
  position: relative;
  width: 100%;
  margin: 0.5em 0 0 0;
}

.search-field {
  /* Поле поиска */
  padding-bottom: 0.25em;
  border-bottom: 0.0625em solid #cccccc;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1.25em;
  line-height: 1.5;
  color: #bbbbbb;
}

.search-prompt {
  /* Подсказка поиска */
  position: absolute;
  width: 100%;
  padding: 0.35em 0.25em 0.4em 0.75em;
  border: 0.0625em solid #cccccc;
  border-top-width: 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1em;
  line-height: 1.5;
  color: black;
}

.search-submit {
  /* Кнопка поиска */
  position: relative;
  display: inline-block;
  height: 2.5em;
  padding: 0.4125em 0.8125em 0em 0.8125em;
  margin: 0.5em 0 0 0.5em;
  background-color: #a7ccff;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1em;
  line-height: 1.5;
  color: black;
  cursor: pointer;
}
.search-submit:hover {
  background-color: #3366bb;
  color: white;
}
@media screen and (max-width: 767px) {
  .search-submit:hover {
    background-color: #a7ccff;
    color: black;
  }
}

p.search-results-1 {
  /* Результат поиска, заголовок найденной страницы */
  padding: 1em 0 0 0;
  font-family: "PT Serif", "Times New Roman", Times, serif;
  font-size: 1.25em;
  line-height: 1.2;
  text-decoration: none;
  color: black;
}
p.search-results-1 a {
  text-decoration: none;
  color: black;
}
p.search-results-1 .phrase {
  font-weight: bold;
}
p.search-results-1 .date {
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 0.575em;
  color: #999999;
}
p.search-results-1.catalogue {
  padding: 0.5em 0 0 0;
  font-size: 2em;
}

p.search-results-1.new-ready:after,
p.search-results-1.new-not-ready:after,
p.search-results-1.updated-ready:after,
p.search-results-1.updated-not-ready:after,
p.search-results-1.previous:after {
  position: relative;
  bottom: 0.35em;
  left: 0.35em;
  padding: 0.1em 0.4em 0.1em 0.4em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  color: white;
  font-size: 0.475em;
}

p.search-results-1.new-ready:after {
  content: "НОВЫЙ КОНТЕНТ";
  background-color: green;
}

p.search-results-1.new-not-ready:after {
  content: "НОВЫЙ КОНТЕНТ";
  background-color: red;
}

p.search-results-1.updated-ready:after {
  content: "ОБНОВЛ. КОНТЕНТ";
  background-color: green;
}

p.search-results-1.updated-not-ready:after {
  content: "ОБНОВЛ. КОНТЕНТ";
  background-color: red;
}

p.search-results-1.previous:after {
  content: "ПРЕЖНИЙ КОНТЕНТ";
  background-color: darkgray;
}

.search-results-type {
  /* Метка в заголовке найденной страницы */
  position: relative;
  bottom: 0.35em;
  padding: 0.1em 0.4em 0.1em 0.4em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 0.475em;
  color: white;
}
.search-results-type.work {
  background-color: #444444;
}
.search-results-type.blog {
  background-color: #6699dd;
}
.search-results-type.pdf {
  background-color: #ff6666;
}

p.search-results-2 {
  /* Результат поиска, цитата или уточнения */
  padding: 0.2em 0 0 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 1em;
  line-height: 1.5;
  color: black;
  text-decoration: none;
}
p.search-results-2 a {
  color: black;
  text-decoration: none;
}
p.search-results-2 .phrase {
  font-weight: bold;
}

p.search-path {
  /* Результат поиска, путь к найденной странице */
  padding: 0.2em 0 0 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  line-height: 1.2;
}

p.search-options-1 {
  padding: 1em 0 0 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 1em;
  line-height: 1.5;
  color: black;
}

.swiper-container.main {
  /* Контейнер слайдера */
  position: fixed;
  top: 3em;
  height: calc(100% - 3em);
  max-height: 100vw;
  width: 100%;
  z-index: 2;
}

.swiper-container.main .swiper-slide > .backgr {
  /* Блок с фоном слайда */
  display: flex;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.swiper-container.main .swiper-slide > .backgr > img {
  /* Картинка в блоке фона слайда */
  width: 100px;
  height: 50px;
  min-width: 100%;
  min-height: 100%;
  flex: none;
  object-fit: cover;
}

.swiper-container.main .swiper-slide > a {
  /* Ссылка в блоке фона слайда */
  position: fixed;
  top: 0;
  height: 100%;
  width: 100%;
}

.swiper-container.main .swiper-slide > .text {
  /* Блок с текстом слайда */
  position: absolute;
  bottom: 0;
  padding: 0 5em 1.2em 1.03em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 1.5em;
  line-height: 1.4em;
  transition: opacity 0.6s 0.3s;
}
.swiper-container.main .swiper-slide > .text.pagination {
  /* Номер слайда */
  width: 4em;
  right: 0;
  padding: 0 0.7em 1.2em 0;
  text-align: right;
}

.swiper-container.main .swiper-slide > .text > .background, .swiper-container.main .swiper-slide > .pagination > .background {
  /* Подложка под текст на слайде */
  display: inline;
  padding: 0 0.3em 0.1em 0.3em;
  box-decoration-break: clone;
  -moz-box-decoration-break: clone;
  -ms-box-decoration-break: clone;
  -o-box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.swiper-container.main .swiper-pagination-fraction {
  /* нумерация слайда */
  position: fixed;
  padding: 0 1em 0.65em 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: bold;
  color: white;
  font-size: 1.5em;
  text-align: right;
  pointer-events: none;
}

.more-categories-list {
  width: 100%;
  max-width: 60.25em;
  padding: 1.5em 0 0 1.25em;
  margin: 0 auto;
  column-count: 4;
  column-gap: 0;
}
@media screen and (max-width: 900px) {
  .more-categories-list {
    display: none;
  }
}

.more-switcher-point {
  /* Место для кнопки то же, что и для кнопки «+Ещё» в работах */
}

.more-categories-switcher {
  /* Кнопка «+Ещё» */
  position: absolute;
  top: 1.2em;
  left: 1.2em;
  display: none;
  align-items: center;
  z-index: 12;
  cursor: pointer;
}
@media screen and (max-width: 900px) {
  .more-categories-switcher {
    display: flex;
  }
}
@media screen and (max-width: 767px) {
  .more-categories-switcher {
    /* Для «мобильных» устройств логотип в другом месте,
    поэтому кнопка «+Ещё» выравнивается по-другому */
    left: 0.95em;
  }
}
.more-categories-switcher > .plus {
  /* Плюс внутри открытой кнопки «+Ещё» */
  display: inline-block;
  width: 2.125em;
  height: 2.125em;
  background: url(/images/icons.svg#more-plus) no-repeat center;
  background-size: 2.125em;
  transform: rotate(45deg);
  transition: transform 0.1s;
  transition-delay: 0.2s;
}
.more-categories-switcher.closed > .plus {
  /* Плюс внутри закрытой кнопки «+Ещё» */
  transform: rotate(0deg);
}
.more-categories-switcher > .more-text {
  /* Текст «Ещё» внутри кнопки «+Ещё» */
  display: none;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 1em;
  margin-left: 0.75em;
}
.more-categories-switcher.closed > .more-text {
  /* Текст внутри закрытой кнопки «+» */
  display: inline-block;
  color: black;
}
.more-categories-switcher > .close-text {
  /* Текст «Закрыть» внутри кнопки «+» */
  display: inline-block;
  margin-left: 0.5em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 1em;
}
.more-categories-switcher.closed > .close-text {
  /* Текст «Закрыть» внутри закрытой кнопки «+» */
  display: none;
}

.more-categories-menu {
  display: none;
  height: 0;
  margin-bottom: 2em;
  overflow: hidden;
  z-index: 2;
  transition: all 0.3s 0.05s;
}
@media screen and (max-width: 900px) {
  .more-categories-menu {
    display: block;
  }
}

.more-categories-menu .sliding-block {
  /* Колонка для категорий портфолио */
  bottom: 0;
  padding: 4em 0 0 1.25em;
  column-width: auto;
  column-count: 3;
  column-gap: 0;
}
@media screen and (max-width: 680px) {
  .more-categories-menu .sliding-block {
    column-count: 2;
  }
}
@media screen and (max-width: 480px) {
  .more-categories-menu .sliding-block {
    column-count: 1;
  }
}

/* Элемент списка категорий портфолио */
.more-categories-list .category,
.more-categories-menu .category {
  display: inline-block;
  padding: 0.5em 0.75em;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  line-height: 1.2;
}
.more-categories-list .category.highlighted,
.more-categories-menu .category.highlighted {
  background-color: #eaeae8;
}
.more-categories-list .category a,
.more-categories-menu .category a {
  text-decoration: none;
  color: #888888;
}
.more-categories-list .category a:hover,
.more-categories-menu .category a:hover {
  color: black;
}
.more-categories-list .category span.number,
.more-categories-menu .category span.number {
  color: #bbbbbb;
  white-space: nowrap;
}
.more-categories-list .category span.number:before,
.more-categories-menu .category span.number:before {
  content: " ";
}
.more-categories-list .category.show-all a,
.more-categories-menu .category.show-all a {
  text-decoration: underline;
  color: #0055cc;
}

.content > .column-7 {
  display: block;
  width: 100%;
  padding: 0 1em;
  margin: 0;
}

.content > .column-7 > .gallery {
  font-size: 1em;
}

.content > .column-7 > .gallery > .gallery-sizer {
  display: none;
  width: 20%;
}
@media screen and (max-width: 1791px) {
  .content > .column-7 > .gallery > .gallery-sizer {
    width: 25%;
  }
}
@media screen and (max-width: 1439px) {
  .content > .column-7 > .gallery > .gallery-sizer {
    width: 33.3332%;
  }
}
@media screen and (max-width: 1087px) {
  .content > .column-7 > .gallery > .gallery-sizer {
    width: 50%;
  }
}
@media screen and (max-width: 735px) {
  .content > .column-7 > .gallery > .gallery-sizer {
    width: 100%;
  }
}

.content > .column-7 > .gallery > .gallery-item {
  display: block;
  width: 20%;
  padding: 1em;
  overflow: visible;
  float: left;
}
@media screen and (max-width: 1791px) {
  .content > .column-7 > .gallery > .gallery-item {
    width: 25%;
  }
}
@media screen and (max-width: 1439px) {
  .content > .column-7 > .gallery > .gallery-item {
    width: 33.3332%;
  }
}
@media screen and (max-width: 1087px) {
  .content > .column-7 > .gallery > .gallery-item {
    width: 50%;
  }
}
@media screen and (max-width: 735px) {
  .content > .column-7 > .gallery > .gallery-item {
    width: 100%;
  }
}
.content > .column-7 > .gallery > .gallery-item.double {
  width: 40%;
}
@media screen and (max-width: 1791px) {
  .content > .column-7 > .gallery > .gallery-item.double {
    width: 50%;
  }
}
@media screen and (max-width: 1439px) {
  .content > .column-7 > .gallery > .gallery-item.double {
    width: 66.6666%;
  }
}
@media screen and (max-width: 1087px) {
  .content > .column-7 > .gallery > .gallery-item.double {
    width: 100%;
  }
}
.content > .column-7 > .gallery > .gallery-item.bottom {
  width: 100%;
  height: 3em;
}

.content > .column-7 > .gallery > .gallery-item > div {
  position: relative;
}

.content > .column-7 > .gallery > .gallery-item > div > div {
  position: absolute;
  width: 100%;
  height: 100%;
}
.content > .column-7 > .gallery > .gallery-item > div > div > a {
  font-size: 0;
}

.content > .column-7 > .gallery > .gallery-item > div > div img,
.content > .column-7 > .gallery > .gallery-item > div > div video {
  display: block;
  width: 100%;
  height: 66.667%;
}

.content > .column-7 > .gallery > .gallery-item > div > div p.date {
  margin: 1em 0 0 0;
  z-index: 1;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 0.85em;
  line-height: 1.2;
  text-align: left;
  color: #aaaaaa;
}

.content > .column-7 > .gallery > .gallery-item > div > div h2 {
  margin: 0.15em 0 0 0;
  z-index: 1;
  font-family: "PT Serif", "Times New Roman", Times, serif;
  font-size: 1.25em;
  line-height: 1.2;
}
.content > .column-7 > .gallery > .gallery-item > div > div h2 a {
  color: black;
  text-decoration: none;
}

@media screen and (min-width: 736px) {
  .content > .column-7 > .gallery > .gallery-item.double > div > div h2 {
    font-size: 2.2em;
  }
}

.content > div.column-7 > .gallery > .gallery-item > div > div p.resume {
  display: none;
  margin: 0.3em 0 0 0;
  z-index: 1;
  font-family: "PT Serif", "Times New Roman", Times, serif;
  font-size: 0.9em;
  line-height: 1.4;
  text-align: left;
  color: #888888;
}
@media screen and (min-width: 475px) {
  .content > div.column-7 > .gallery > .gallery-item > div > div p.resume {
    display: block;
  }
}
@media screen and (min-width: 736px) {
  .content > div.column-7 > .gallery > .gallery-item > div > div p.resume {
    display: none;
  }
}

@media screen and (min-width: 736px) {
  .content > .column-7 > .gallery > .gallery-item.double > div > div p.resume {
    display: block;
    font-size: 1.25em;
  }
}

.content > div.column-7 > .gallery > .gallery-item > div {
  font-size: 1em;
}

.content > div.column-7 > .gallery > .gallery-item > div > img {
  display: block;
  width: 100%;
  visibility: hidden;
}

.cookie-warning-pop-up {
  position: fixed;
  display: none;
  width: 100%;
  z-index: 3;
  background-color: #444444;
}
.cookie-warning-pop-up.hidden {
  bottom: -6em;
  display: block;
  opacity: 0;
  transition: opacity 0.2s ease-out 0.25s, bottom 0.3s 0.25s;
}
.cookie-warning-pop-up.unhidden {
  bottom: 0;
  display: block;
  opacity: 1;
  transition: opacity 0.3s ease-in 0.25s, bottom 0.4s 0.25s;
}
.cookie-warning-pop-up .column {
  display: flex;
  min-height: 4em;
  max-width: 60.25em;
  margin: 0.5em auto;
  padding: 0 2em;
  align-items: center;
}
.cookie-warning-pop-up .column .warning-text {
  width: 100%;
  margin: 0 2em 0 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 1em;
  line-height: 1.4;
  text-align: left;
  color: white;
}
.cookie-warning-pop-up .column .ok-button {
  padding: 0.6em 1em 0 1em;
  height: 2.5em;
  background-color: #888888;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-align: left;
  font-size: 1em;
  color: white;
  cursor: pointer;
}
.cookie-warning-pop-up .column .ok-button:hover {
  background-color: white;
  color: black;
}
@media screen and (max-width: 767px) {
  .cookie-warning-pop-up .column .ok-button:hover {
    background-color: #888888;
    color: white;
  }
}

p.copyrighttext {
  display: block;
  padding: 3em 0;
  font-family: "PT Sans Caption", Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  line-height: 1.2;
  text-align: center;
  color: #888888;
}

/*# sourceMappingURL=styles.css.map */