body {background: url(/assets/template/images/fon.jpg) no-repeat left; background-attachment: fixed; font-size: 14px; padding: 0px; margin:0; font-family: Arial, Helvetica, sans-serif;}


img { border: 0 none; }
.mclr {float:none!important; height:1px; clear:both!important;}
a {color:#0f3389;}
a:hover {text-decoration:none;}
h1 {font-size:26px; font-weight:normal; padding:0 0 0 0; margin:0 0 10px 0;}

#site {width:100%;  padding:0; background: url(/assets/template/images/fon.jpg) no-repeat right; background-attachment: fixed; }
#basic {width:980px; padding:0 10px;  margin:0 auto; background:#fff url(/assets/template/images/fon-basic.jpg) repeat-y;  border:0; box-sizing:border-box;}
/* Шапка собрана из отдельных картинок: логотип + коллаж журналов + полоса-меню (градиент) */
#shapka {width:auto; position:relative; margin:0 -10px;}
.shapka-top {display:flex; align-items:center; justify-content:space-between;  padding:0 5px;}
.logo {display:block; width:245px; flex:0 0 auto; line-height:0; margin-left:30px;}
.logo img {display:block; width:245px; height:auto;}
.shapka-journals {display:block; flex:1 1 auto; overflow:hidden; width:653px; max-width:653px; height:124px; background:url(/assets/template/images/top-j.jpg) no-repeat left top;}

/* Полоса меню с градиентом: края #652890 → переход #113488 → центр #244cae */
.menu-bar {
  position:relative;
  padding:0 30px;
  margin-bottom:23px; /* 13px под полосу-тень (::after) + 10px отступ после меню */
  background: linear-gradient(to right,
    #652890 0%, #113488 25%, #244cae 50%, #113488 75%, #652890 100%);
}
/* Полоса-тень под меню (980×13) */
.menu-bar::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:100%;
  height:13px;
  background:url(/assets/template/images/bottom-menu-back.jpg) no-repeat center top;
}
#content {padding:0 10px; min-height:500px;}

.pull-left {float:left; margin:5px 0 0 0;}
.pull-left img {width:200px;  margin:0 10px 0 0;}

.calmeo-block {text-align:left; font-size:13px; color:#8e8eaa;}
.blog .calmeo-block {display:none;}
.blog {}
.blog h2 {font-size:18px; margin:20px 0 0 0; padding:0;}

.blog p {margin:0!important;}
.blog p.readmore {}
/*Меню*/
.menu-top {padding:0; margin:0; list-style:none; display:flex; flex-wrap:wrap;}
.menu-top li {}
.menu-top li a {color:#fff; text-decoration:none; font-weight:bold; font-size:15px; display:block; padding:12px 16px; line-height:1;}
.menu-top li a:hover {background:#ff0000;}
.item-108 a, .item-112 a{background:rgba(255,0,0,.85)!important;}

div.vipmenupsevdo { width:108px; height:41px; position:absolute; top:123px; left:140px;}
.moduletable-menuvip {z-index:1000; padding:0 10px 0 10px; position:absolute; width:956px; height:330px; top:41px; left:-140px; background:#fff; display:none;  border-left:2px solid #113486; border-right:2px solid #113486;}
div.vipmenupsevdo:hover div.moduletable-menuvip {display:block;}

.custom-menuvip img {}
.custom-menuvip a { padding:0; margin-right:19px; height:256px; display:block; width:170px; }
.endimg a{margin-right:0px!important; }
.link-zhurnaly {display:block; width:108px; height:41px; }

.bot-zhurnaly {display:none; z-index:1000;  position:absolute; top:370px; left:-140px; width:980px; height:8px; background:url(/assets/template/images/bot-zurnal.png) no-repeat bottom;}
div.vipmenupsevdo:hover div.bot-zhurnaly {display:block;}

.moduletable-menuvip h3 {font-weight:normal; margin:10px 0; padding:0; font-size:24px; text-transform:uppercase;}

.item {overflow:hidden;}

.avtosb{padding:10px 0 0 0;}
.avtosb img{width:225px; height:auto; }
.avtosb1{float:left; margin:0 10px 20px 0;}
.avtosb2{float:left; margin:0 10px 20px 0;}
.avtosb3{float:left; margin:0 0 20px 0;}

/*Р–СѓСЂРЅР°Р»С‹ РЅР° РіР»Р°РІРЅРѕР№*/

/* Ряд журналов на главной: flex-сетка. Картинки всегда 170×95 (не тянутся).
   Всегда выравниваются по ЦЕНТРУ с равными зазорами. Когда баннеры перестают
   влезать в ряд (<980px) — лишние переносятся на следующую строку и тоже
   центрируются (неполная строка остаётся по центру, а не прижата к краям). */
.custom-jornal-gl {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 20px;
  row-gap: 15px;
}
.jornal-gl-item { flex: 0 0 170px; line-height: 0; }
.jornal-gl-item img { display: block; width: 170px; height: 95px; }
.moduletable-jornal-gl h3 {font-weight:normal; margin:10px 0 15px 0; padding:0; font-size:24px; text-transform:uppercase;}
.moduletable-jornal-gl {margin:0 0 15px 0;}

/*Р›РµРІС‹Р№ Р±Р»РѕРє*/
#left {float:left; width:700px;  }


/*РџСЂР°РІС‹Р№ Р±Р»РѕРє*/
#right {float:right; width:224px;}

.pagination ul{
  padding:0;
  margin:0;
  list-style:none;
}

.pagination ul li{
  float:left;
  margin:0 10px 0 0;
}
.pagination-next .hasTooltip, .pagination-end .hasTooltip, .pagination-start, .pagination-prev {
  background:none; display:none;
}
/*РџР°СЂС‚РЅРµСЂС‹*/
.module-partners {position:relative; padding:0 0 0 0; margin-bottom:20px;  } 
.module-partners p {padding:10px 0 0 0; margin:0;}
.module-partners h3 {position:absolute; width:183px; margin:0; z-index:105; top:0px; left:10px; display:block; padding:5px 10px; background:red; color:#fff; font-weight:bold; font-style:italic;}

.module-partners div.onediv{ position:relative; z-index:104;}
.module-partners div div{ }
.module-partners div div div{}
.module-partners div div div div{}
.module-partners div div div div div{width:224px;    text-align:center;}
#right img {width:224px; height:auto;  padding-top:10px;}
.module-partners p {margin:0 0 10px 0; padding:0;}

.topm {position:absolute; width:216px; padding:0!important; top:0; height:6px; left:4px;   z-index:104;}
.botm {position:absolute; width:216px; padding:0!important; bottom:0; height:6px; left:4px;  z-index:104;} 

.ten-right {background:url(/assets/template/images/ten-right.png) no-repeat bottom; height:15px; width:224px;}

.custom-partners {margin:10px 0 0 0!important;}

/*РЎР»Р°Р№РґРµСЂ*/
/* Слайдер на главной (2 шт). Рамка — чистый CSS (без top-slide.jpg /
   bot-slide.jpg): синий фон #103586, отступ-рамка 3px и скруглённые углы.
   Одинаково на десктопе и в адаптиве. overflow:hidden обрезает картинку
   слайдшоу по скруглению. */
.slider-gl {width:701px; margin-top:10px; background:#103586; padding:3px; border-radius:8px; box-sizing:border-box;}
.slider-gl2 {background:transparent; padding:0; border-radius:5px; overflow:hidden;}
.ten-dl {width:701px; height:10px; background: url(/assets/template/images/ten-dl.png) no-repeat;}

/* Точки-пейджер: наложение ПОВЕРХ картинки слайдера, в левом нижнем углу,
   отступы 10px. Крупные белые полупрозрачные круги. Пейджер — absolute,
   поэтому точки не раздвигают подложку (.jmslideshow уже position:relative —
   он и есть якорь, его высоту задаёт картинка слайда width:100%).
   Перебиваем спрайт control_button.png, float и right:30px
   из mod_jmslideshow_default.css. */
.jmslideshow .cycle-pager.pager-over {
  position:absolute !important;
  left:10px !important; right:auto !important; bottom:10px !important;
  top:auto; width:auto; z-index:999 !important; line-height:0; font-size:0;
}
/* cycle2 рисует каждую точку как <span>&bull;</span>. Гасим символ bullet
   (font-size:0 + color:transparent) и рисуем кружок через background. */
.jmslideshow .cycle-pager.pager-over span {
  display:inline-block !important; float:none !important; vertical-align:middle;
  width:10px !important; height:10px !important; margin:0 10px 0 0 !important;
  padding:0 !important; border-radius:50% !important; font-size:0 !important;
  background:rgba(16,53,134,.55) !important; background-image:none !important;
  text-indent:0; color:transparent; cursor:pointer; transition:background .2s;
}
.jmslideshow .cycle-pager.pager-over span.cycle-pager-active {background:rgba(16,53,134,.9) !important;}

/*РќРѕРІРѕСЃС‚Рё*/
.block-news {position:relative; padding:10px 0 0 0; text-align:left;}

/* Синяя подложка: скругление и горизонтальный градиент через CSS
   (#0f3389 по краям -> #073eb2 по центру), без картинок-углов. */
.news-pol-gr {width:701px; margin-top:0px; border-radius:8px; overflow:hidden;
  background:linear-gradient(to right, #0f3389 0%, #073eb2 50%, #0f3389 100%); }
.news-top-blue {width:701px; margin-top:0; background:none;}
.news-bot-blue {position:relative; width:677px; background:none; padding:20px 12px 45px 12px; }

.news-top-wite {width:676px; margin-top:16px; background:none;}
.news-bot-wite {width:656px; background:#fff; border-radius:8px; padding:10px; overflow:hidden;}

.newsflash-title {margin:0 0 10px 0; padding:0; font-size:16px;}
.newsflash-title a{color:#000; }

/* Сетка новостей на Grid: 2 ровные колонки без «проваливания» карточек
   (раньше был float:left + width:46%, из-за разной высоты карточек
   следующая цеплялась за предыдущую и появлялись дыры). */
.newsflash {display:grid; grid-template-columns:repeat(2, 1fr); gap:10px 2%;}
.pol-new-punkt {padding:0 0 15px 0; margin:0; overflow:hidden; }

.all-news {position:absolute; display:bloc;  bottom:5px; right:10px; display:block; width:110px; height:26px; color:#fff; }


.news-h {position:absolute; width:; margin-top:12px; z-index:105; top:0px; left:15px; display:block; padding:5px 0; background:; color:#fff; font-weight:bold; font-style:italic;}


/*РџРѕРґРІР°Р»*/
/* Подложка подвала: горизонтальный градиент (#0f3389 по краям → #073eb2 в центре)
   со скруглёнными углами. Заменяет прежние фикс-ширинные картинки foot-top/pol/bot,
   поэтому тянется на любую ширину и одинаково работает и на 980px, и на мобильных. */
.footer { width:940px; margin:15px auto 0 auto; background: linear-gradient(to right, #0f3389 0%, #073eb2 50%, #0f3389 100%); border-radius:8px; color:#fff; font-size:12px; }
.footer-bot {width:920px; padding:10px 10px; }

.copyrite {float:left; width:590px; }
.slash {float:left; width:270px; text-align:right; padding:6px 0 0 0;}
.slash a {color:red;}
.stat {float:left; width:60px; padding:6px 0 0 0; text-align:right}

/*РџРѕРёСЃРє*/
.search {margin:10px 0 10px 0;}
#mod-search-searchword {float:left; width:174px;padding:0 10px 0 10px; height:28px; background: url(/assets/template/images/poisk.png) no-repeat; border:0;}
.btn-primary {width:30px; height:28px; background: url(/assets/template/images/poisk-bot.png) no-repeat; border:0; cursor:pointer; font-size:0; overflow:hidden; text-decoration:none; float:left;}

#search-searchword {float:left; width:174px;padding:0 10px 0 10px; height:28px; background: url(/assets/template/images/poisk.png) no-repeat; border:0;}
.hasTooltip {width:30px; height:28px; background: url(/assets/template/images/poisk-bot.png) no-repeat; border:0; cursor:pointer; font-size:0; overflow:hidden; line-height:999px; float:left;}

/* ==========================================================================
   Адаптив (добавлено). Десктоп-вёрстка выше не меняется — все правила ниже
   активны только на планшетах/телефонах через медиазапросы.
   Гамбургер-кнопка и чекбокс по умолчанию скрыты.
   ========================================================================== */
.nav-toggle, .nav-toggle-label { display: none; }

/* --- Планшет и уже: резиновые ширины, одна колонка --- */
@media (max-width: 980px) {
  /* Отсекаем горизонтальный скролл от любых «широких» остатков вёрстки */
  html, body { overflow-x: hidden; }
  body { background-attachment: scroll; }
  #site { background: none; }
  /* Резиновая ширина. Красные полоски по краям — CSS-градиентом (родная
     картинка fon-basic.jpg 980px при сжатии уехала бы), чтобы держались
     ровно у обоих краёв на любой ширине. */
  #basic {
    width: 100%;
    max-width: 980px;
    background:
      linear-gradient(to right, #e30613 0, #e30613 3px, transparent 3px) left top / 100% 100% no-repeat,
      linear-gradient(to left,  #e30613 0, #e30613 3px, transparent 3px) right top / 100% 100% no-repeat,
      #fff;
  }
  /* Шапка/меню — от края до края #basic. Держим десктопные отрицательные поля
     (компенсируют padding:0 10px у #basic), но НЕ задаём width:100% — иначе
     ширина станет 100%+20px и справа вылезет белое поле */
  #shapka { width: auto; margin: 0 -10px; }
  /* Убираем правый паддинг ряда шапки — иначе коллаж журналов не доходит
     до края и справа остаётся ~5px отступ */
  .shapka-top { padding-right: 3px; }
  /* Логотип единого размера (245px) на всех разрешениях;
     коллаж журналов тянется и обрезается справа */

  /* Ниже 980px: убираем полосу-тень под меню и включаем гамбургер */
  .menu-bar::after { display: none; }
  .menu-bar { margin-bottom: 10px; min-height: 48px; }

  /* Кнопка-гамбургер по центру полосы меню.
     flex-центрирование — полоски строго симметричны внутри кнопки */
  .nav-toggle-label {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
    width: 44px;
    height: 36px;
    box-sizing: border-box;
    background: rgba(0,0,0,.2);
    border-radius: 4px;
    cursor: pointer;
    z-index: 1100;
  }
  .nav-toggle-label span {
    display: block;
    width: 24px;
    height: 3px;
    margin: 3px 0;
    background: #fff;
    border-radius: 2px;
  }

  /* Меню по умолчанию скрыто, раскрывается по чекбоксу */
  .menu-top {
    display: none;
    flex-direction: column;
    margin: 0;
    padding: 0;
  }
  /* Раскрытое меню начинается ПОД кнопкой-гамбургером (48px — высота полосы),
     чтобы первый пункт «О компании» не оказывался на одной линии с иконкой */
  #nav-toggle:checked ~ .menu-top { display: flex; padding-top: 48px; }

  .menu-top li { float: none; width: 100%; }
  .menu-top li a {
    display: block;
    height: auto;
    padding: 13px 15px;
    border-top: 1px solid rgba(255,255,255,.2);
    font-size: 16px;
  }
  .menu-top li a:hover { background: #ff0000; }

  /* Глобально: ничто не шире своего контейнера */
  img, table, iframe, embed, object { max-width: 100%; }

  #content { padding: 0 10px; box-sizing: border-box; }

  /* Левый и правый блок — в одну колонку */
  #left  { float: none; width: auto; }
  /* Ниже 980px правый блок на всю ширину, его содержимое — по центру */
  #right { float: none; width: auto; margin-top: 20px; text-align: center; }
  #right img { width: 100%; max-width: 224px; height: auto; }

  /* ВК-виджет: iframe блочный, text-align:center его не берёт — центрируем
     контейнер через margin:auto, ширина виджета фиксированная 224px. */
  #right #vk_groups {
    width: 224px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  #right #vk_groups iframe { display: block; margin: 0 auto; }

  /* Форма поиска: поля внутри — float:left, из-за чего прижаты к левому краю.
     Снимаем float и выстраиваем поля по центру (text-align:center на #right). */
  #right .search { margin-left: auto; margin-right: auto; }
  #right .search .form-inline { display: inline-block; }
  #right .search #mod-search-searchword,
  #right .search .btn-primary { float: none; display: inline-block; vertical-align: middle; }

  /* Баннеры правой колонки: убираем фикс-ширины 224px и рамки-картинки.
     ВАЖНО: .custom-partners НЕ обнуляем — ему задаём фикс-ширину ниже,
     иначе это правило (.module-partners div, специфичность выше) затрёт её. */
  .module-partners div div div div div { width: auto; }
  .module-partners .topm, .module-partners .botm,
  .ten-right { display: none; }

  /* Баннеры 520–980px: сам БЛОК фиксируем по ширине под 2 колонки по 224px
     и центрируем через margin:auto. Фикс-ширина и центровка висят на
     .module-partners / .onediv (это визуальный блок с заголовком),
     а раскладка — КЛАДКА (CSS columns) на .custom-partners.
     break-inside:avoid даёт masonry без вертикальных пустот при
     баннерах разной высоты. На ≤520px (ниже) — 1 колонка. */
  .module-partners {
    width: 463px;          /* 224 + 15 (gap) + 224 — ровно 2 колонки */
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
  }
  .module-partners .onediv { width: auto; }
  .custom-partners {
    margin: 10px 0 0 0 !important;
    width: auto;
    columns: 2;
    column-gap: 15px;
  }
  .custom-partners p {
    margin: 0 0 15px 0;
    line-height: 0;
    break-inside: avoid;   /* баннер не разрывается между колонками */
    -webkit-column-break-inside: avoid;
  }
  .custom-partners img { width: 224px; max-width: 100%; height: auto; display: block; }

  /* Блоки новостей: убираем фикс-ширины. Градиент и скругление у
     .news-pol-gr / .news-bot-wite задаются в базовых стилях на CSS
     и работают на всех ширинах, поэтому тут их не сбрасываем. */
  .news-pol-gr, .news-top-blue, .news-bot-blue,
  .news-top-wite, .news-bot-wite { width: auto; }
  .news-top-blue, .news-bot-blue, .news-top-wite { background: none; }
  .news-bot-blue { padding: 15px; }
  .news-bot-wite { width: auto; padding: 10px; }
  /* Ссылка «Все новости»: на десктопе absolute с запасом снизу (45px),
     которого тут больше нет. Выводим в потоке справа — она ложится на
     синий фон .news-bot-blue, поэтому текст остаётся белым. */
  .all-news { position: static; display: block; width: auto; height: auto;
    text-align: right; margin-top: 8px; color: #fff; }
  .block-news img { max-width: 100%; height: auto; }

  /* Слайдер на главной (2 шт): рамка уже на CSS в базовых стилях
     (.slider-gl). Тут только делаем блок резиновым и центрируем. */
  .slider-gl, .ten-dl {
    width: 100%;
    max-width: 701px;
    margin-left: auto;
    margin-right: auto;
  }
  .ten-dl { background-image: none; }

  /* Ряд журналов: фикс-размер 170px задан в базовом правиле .custom-jornal-gl
     и работает одинаково на всех ширинах (space-between + перенос), поэтому
     тут отдельных правил не требуется. */

  /* Подвал: подложка-градиент из базового правила .footer тянется на любую
     ширину, поэтому ниже 980px её не отключаем — лишь снимаем фикс-ширину
     внутренних блоков, чтобы они растянулись по контейнеру. */
  .footer { width: 100%; max-width: 940px; }
  .footer-top, .footer-bot { width: auto; padding: 10px 15px; }
  .copyrite, .slash, .stat { float: none; width: auto; text-align: left; padding: 4px 0; }

  /* Контентные картинки не вылезают за экран */
  .item-page img, .blog img { max-width: 100%; height: auto; }
  .pull-left img { width: auto; max-width: 200px; }
}

/* --- Телефон: коллаж журналов НЕ прячем —
   он, как и на десктопе, обрезается справа до последнего --- */
@media (max-width: 760px) {
  /* Главная: журналы-ряд и новости колонки в один столбец */
  .newsflash { grid-template-columns: 1fr; }
  .pol-new-punkt { margin: 0 0 10px 0; }
  .avtosb1, .avtosb2, .avtosb3 { float: none; margin: 0 0 15px 0; }
  .avtosb img { width: 100%; height: auto; max-width: 225px; }

  h1 { font-size: 22px; }
}

/* --- Баннеры: ≤520px — 1 колонка, блок по центру.
   Сужаем сам блок до ширины одного баннера (224px), columns:1 --- */
@media (max-width: 520px) {
  .module-partners { width: 224px; }
  .custom-partners { columns: 1; }
  .custom-partners img { margin: 0 auto; }
}

/* --- Узкие телефоны: журналы прячем, логотип по центру.
   Высоту шапки держим искусственно (min-height), чтобы не схлопывалась --- */
@media (max-width: 480px) {
  .shapka-journals { display: none; }
  .shapka-top {
    justify-content: center;
    min-height: 124px;
  }
  .logo { margin-left: 0; }
}

