@charset "UTF-8";
/**
* @file common.css
* @author @BabaninFV (IWT Lab.)
* @createDate 2014/07/07
* @lastChange 2014/07/07
* @version 2.0
*/

html, body {
  font-family: 'Proxima Nova Regular';
  color: #000;
}

a:hover {
  text-decoration: none;
}

.brackets-sym:before {
  content: "(";
}

.brackets-sym:after {
  content: ")";
}

.wrapper {
  width: 1170px;
  margin: 0 auto;
}

.wrapper-gap {
  padding-top: 50px;
  padding-bottom: 64px;
}

.section-header {
  text-transform: uppercase;
  font-size: 30pt;
  font-family: 'Proxima Nova Condensed Bold';
  margin-bottom: 30px;
}

/* Подтверждение телефона через MAX на вкладке «Телефон» */
.cb-max-phone {
  border: 1px solid #d6d8de;
  border-radius: 6px;
  padding: 14px 16px;
  background-color: #f7f8fa;
  max-width: 560px;
}

.cb-max-phone-title {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 6px;
}

.cb-max-phone-note {
  font-size: 14px;
  color: #4a4f57;
  line-height: 1.4;
  margin-bottom: 10px;
}

.cb-max-phone-btn a {
  display: inline-block;
  background-color: #2f9e44;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  padding: 9px 16px;
  font-size: 15px;
}

.cb-max-phone-btn a:hover {
  background-color: #27873a;
}

.cb-max-phone-ok {
  background-color: #2f9e44;
  color: #fff;
  border-radius: 4px;
  padding: 10px 14px;
  font-size: 15px;
}

/* Сообщения (smarty/templates/components/umessage.tpl).
   Раньше их классы были описаны только в старом style_xhtml.css, которого новый
   дизайн не подключает, поэтому текст выводился без оформления. Теперь успех и
   подсказка — зелёная плашка, ошибка — красная. */
.umessage_info_div,
.umessage_alert_div,
.umessage_error_div {
  border: 0;
  border-radius: 6px;
  padding: 13px 20px;
  margin: 0 0 16px;
  color: #fff;
  font-size: 16px;
  line-height: 1.35;
  text-align: center;
}

.umessage_info_div,
.umessage_alert_div {
  background-color: #2f9e44;
}

.umessage_error_div {
  background-color: #c92a2a;
}

.umessage_info_div a,
.umessage_alert_div a,
.umessage_error_div a {
  color: #fff;
  text-decoration: underline;
}

.umessage_content_div {
  margin: 0;
  text-align: center;
}

/* строка-разделитель после сообщения в старом компоненте лишняя */
br.cls {
  display: none;
}

/* Рекламные места главной: рамка показывается, только если баннер залит
   (пустой блок в шаблон вообще не попадает) */
#topBanners {
  padding: 25px 0 0;
}

#topBanners img {
  max-width: 100%;
  height: auto;
}

.cb-news-banner img {
  max-width: 100%;
  height: auto;
}

/* Заголовок раздела — ссылка на сам раздел: вид не меняется, только курсор
   и лёгкое затемнение при наведении */
.section-header a.section-header-link {
  color: inherit;
  text-decoration: none;
}

.section-header a.section-header-link:hover {
  opacity: 0.72;
}

/* Главная: линейка новостей — три в ряд, две линии (всего шесть). У каждой
   новости обложка; картинка вписывается в рамку без искажений */
.cb-news-grid {
  margin: 0 -15px;
}

.cb-news-item {
  float: left;
  width: 370px;
  margin: 0 15px 30px;
}

/* каждый четвёртый элемент начинает новый ряд: заголовки разной длины больше
   не «разъезжаются» — раскладка всегда три в ряд */
.cb-news-item:nth-child(3n + 1) {
  clear: left;
}

.cb-news-item-image {
  display: block;
  height: 208px;
  overflow: hidden;
  margin-bottom: 12px;
}

.cb-news-item-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cb-news-item-title {
  display: block;
  font-size: 17px;
  line-height: 1.25;
  text-transform: uppercase;
  font-family: 'Proxima Nova Bold';
  margin-bottom: 6px;
  height: 46px;          /* две строки заголовка: ряды выравниваются */
  overflow: hidden;
}

.cb-news-item-date {
  font-size: 15px;
}

/* ctrls */
.button {
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  display: block;
}

.button-box {
  color: #fff;
  border-width: 3px;
  border-style: solid;
  padding: 10px 18px 8px;
}

.button-box-blue {
  color: #00aeef;
}

.shadow-black-bottom {
  text-shadow: 0 3px 0 #000;
}

/* icons */
.ico {
  background-image: url('i/s.png');
  display: inline-block;
  vertical-align: middle;
}

.ico-close {
  background-position: 0 -58px;
  width: 32px;
  height: 32px;
}

.ico-twitter {
  background-position: 0 0px;
  width: 26px;
  height: 26px;
}

.ico-facebook {
  background-position: -28px 0;
  width: 26px;
  height: 26px;
}

.ico-odnoklassniki {
  background-position: -56px 0;
  width: 26px;
  height: 26px;
}

.ico-instagram {
  background-position: -84px 0;
  width: 26px;
  height: 26px;
}

.ico-vk {
  background-position: -112px 0;
  width: 26px;
  height: 26px;
}

.ico-arrow-up {
  background-position: 0 -43px;
  width: 17px;
  height: 10px;
}

.ico-arrow-down {
  background-position: 0 -31px;
  width: 17px;
  height: 10px;
}

.ico-eye-gray {
  background-position: 0 -95px;
  width: 24px;
  height: 12px;

  position: relative;
  top: -1px;
}

.ico-eye-darkgray {
  background-position: 0 -115px;
  width: 24px;
  height: 12px;

  position: relative;
  top: -1px;
}

.ico-comment-gray {
  background-position: -26px -95px;
  width: 19px;
  height: 18px;
}

.ico-comment-darkgray {
  background-position: -26px -115px;
  width: 19px;
  height: 18px;
}

.ico-audio-gray {
  background-position: -47px -95px;
  width: 16px;
  height: 16px;
}

.ico-photos-darkgray {
  background-position: -93px -115px;
  width: 31px;
  height: 32px;
}

.ico-author-darkgray {
  background-position: -65px -115px;
  width: 26px;
  height: 20px;
}

.icon-type {
  display: block;
  width: 62px;
  height: 62px;
  background-position: 0 0;
  background-repeat: no-repeat;
}

.icon-type-photo {
  background-image: url('i/types/photo.png');
}

.icon-type-art {
  background-image: url('i/types/art.png');
}

.icon-type-barman {
  background-image: url('i/types/barman.png');
}

.icon-type-girl {
  background-image: url('i/types/girl.png');
}

.icon-type-boy {
  background-image: url('i/types/boy.png');
}

/** HEADER **/
.logo-image {
  background-image: url('i/logo.png');
  height: 22px;
  width: 200px;
  margin-top: 18px;
}

#headerMenu {
  width: 430px;
}

#headerMenu li {
  float: left;
  width: 100px;
  margin-bottom: 10px;
}

#userPanel {
  width: 270px;
}

#userPanel .userinfo {
  height: 32px;
}

/** WELCOME **/
.welcome-content {
  width: 865px;
  padding-top: 55px;
}

.welcome-text {
  width: 545px;
  margin-left: 85px;
}

/* ACTUAL */
.puzzle-container {
  position: relative;
  margin-bottom: -20px;
}

.puzzle-container-actual {
  height: 460px;
}

.puzzle-item {
  display: block;
}

.puzzle-item-banner {
  height: 460px;
}

.puzzle-item-actual {
  width: 218px;
  height: 218px;
  margin-bottom: 20px;
}

.puzzle-item-actual.w2 {
  width: 456px;
}

.puzzle-item-actual.h2 {
  height: 456px;
}

.puzzle-item-actual.w2h2 {
  width: 456px;
  height: 456px;
}


.puzzle-item-news,
.puzzle-item-articles {
  width: 370px;
  margin-bottom: 20px;
}

.puzzle-item-news.w2,
.puzzle-item-articles.w2 {
  width: 770px;
}

.puzzle-item-news.h2,
.puzzle-item-articles.h2 {
  height: 770px;
}

.puzzle-item-news.w2h2,
.puzzle-item-articles.w2h2 {
  width: 770px;
}

.puzzle-item-news .puzzle-item-image,
.puzzle-item-articles .puzzle-item-image {
  height: 175px;
}

.puzzle-item-news img,
.puzzle-item-articles img {
  min-width: 370px;
}

.puzzle-item-news.w2h2 .puzzle-item-image,
.puzzle-item-articles.w2h2 .puzzle-item-image {
  height: 360px;
}

.puzzle-item-news.w2h2 img,
.puzzle-item-articles.w2h2 img {
  min-width: 770px;
}

.puzzle-item-info-container {
  line-height: 25px;
}

.puzzle-item-info-container-actual {
  max-width: 360px;
  max-height: 120px;
  padding: 24px 20px 15px;
  
  position: absolute;
  bottom: 24px;
  left: 24px;
}

.puzzle-item-info-container-news,
.puzzle-item-info-container-articles {
  margin-top: 13px;
}

.puzzle-item-info-container-full {
  max-width: none;
  max-height: none;

  top: 0;
  left: 0;
  right: 0;
  bottom: 0;

  line-height: 20px;
  text-align: center;
}

.puzzle-item-info-container-bottom {
  max-width: none;
  max-height: none;

  left: 0;
  right: 0;
  bottom: 0;

  line-height: 20px;
}

.puzzle-item-title {
  font-size: 15pt;
  display: block;
}

.puzzle-item-actual .puzzle-item-title {
  text-shadow: 0 3px 0 #000;
}

.puzzle-item-title-small {
  font-size: 12pt;
}

.puzzle-item-info-container-full .puzzle-item-info-date,
.puzzle-item-info-container-bottom .puzzle-item-info-date {
  margin-right: 0;
  display: block;
}

.puzzle-item-info-container-full .puzzle-item-info-container-data {
  display: table-cell;
  vertical-align: bottom;
  height: 179px;
}

.puzzle-item-info-container-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #000;
  opacity: .5;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
}

.puzzle-item-image {
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: block;
}

.puzzle-item.h2 .puzzle-item-image img {
  height: 100%;
}

.puzzle-item.w2 .puzzle-item-image img {
  width: 100%;
}

/* EVENTS */
.events-scrollbox {
  height: 537px;
}

.events-scrollbox-item {
  width: 240px;
}

.events-scrollbox-item:last-child,
.events-scrollbox-days:last-child {
  margin-right: 0;
}

.events-scrollbox-item-cover {
  overflow: hidden;
  width: 240px;
  height: 340px;
}

.events-scrollbox-item-cover img {
  height: 340px;
}

/* PLACES */
.places-scrollbox {
  height: 410px;
}

.places-scrollbox-item {
  width: 240px;
}

.places-scrollbox-item:last-child,
.places-scrollbox-days:last-child {
  margin-right: 0;
}

.places-scrollbox-item-cover {
  width: 240px;
  height: 240px;
  overflow: hidden;
}

.places-scrollbox-item-cover img {
  /* обложка заведения вписывается в квадрат 240x240 целиком: раньше картинка
     растягивалась по min-height и обрезалась по краям */
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* MUSIC */
.music-scrollbox {
  height: 280px;
}

.music-item {
  width: 218px;
  height: 218px;
}

.music-item:last-child,
.music-scrollbox-days:last-child {
  margin-right: 0;
}

.music-item-hover-container {
  background-color: rgba(26,46,53,0.75);
}

.music-item-title {
  padding: 0 15px;
}

.music-circle-player {
  position: relative;
  height: 74px;
  width: 74px;
  margin: 0 auto;
}

.music-item img {
  width: 218px;
}

/* PHOTOS */
.album-container {
  margin-bottom: 40px;
}

.album-container:last-child {
  margin-bottom: 0px;
}

.album-header-container {
  height: 40px;
}

.album-content-container {
  height: 300px;
}

.album-cover-container {
  width: 530px;
  height: 300px;
  float: left;
}

.album-cover-container img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.album-photos-container {
  height: 300px;
  overflow: hidden;
}

.album-photos-item {
  width: 140px;
  height: 140px;
  overflow: hidden;
  float:left;
  margin-left: 20px;
  margin-bottom: 20px;
  display: block;
}

.album-photos-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* NEW PERSONES */
.persones-container {
  height: 180px;
}

.persones-item {
  width: 180px;
  height: 180px;
  display: block;
  float: left;
  margin-right: 18px;
  overflow: hidden;
  position: relative;
}

.persones-item:last-child {
  margin-right: 0px;
}

.persones-item-hover-container {
  display: none;
  background-color: rgba(0,28,39, 0.75);
}

.persones-item:hover .persones-item-hover-container {
  display: block;
}

/* FOOTER */
#footer .wrapper {
  padding: 27px 0 35px;
}

.footer-logo {
  background: url(i/logo.png) no-repeat 0 0;
  width: 200px;
  height: 22px;
}

.footer-info-container {
  padding-right: 140px;
}

.footer-contacts-container {
  width: 228px;
  padding-left: 45px;
}

.footer-menu {
  float: left;
}

.footer-menu-item {
  margin-bottom: 13px;
}

/* debug */
#header {
  height: 100px;
}

#welcome {
  height: 360px;
}

/* ===== Личный кабинет в шапке ===== */
#cabinetBar {
  background-color: #191919;
  border-bottom: 1px solid #2b2b2b;
  font-size: 14px;
}

#cabinetBar .cabinet-inner {
  height: 40px;
}

#cabinetBar .cabinet-label {
  float: left;
  color: #00aeef;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: .07em;
  line-height: 40px;
  margin-right: 24px;
}

#cabinetMenu {
  float: left;
  margin: 0;
  padding: 0;
}

#cabinetMenu li {
  float: left;
  margin: 0;
  padding: 0;
  list-style: none;
}

#cabinetMenu li a {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: 0 15px;
  line-height: 40px;
  border-left: 1px solid #2b2b2b;
}

#cabinetMenu li:first-child a {
  border-left: none;
}

#cabinetMenu li a:hover {
  color: #00aeef;
}

.cabinet-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 0 6px;
  border-radius: 9px;
  background-color: #00aeef;
  color: #fff;
  font-size: 11px;
  font-weight: normal;
  line-height: 16px;
  vertical-align: 2px;
}

#cabinetBar .cabinet-exit {
  float: right;
  color: #999;
  text-decoration: none;
  line-height: 40px;
}

#cabinetBar .cabinet-exit:hover {
  color: #00aeef;
}

/* вход для гостя в шапке */
.userpanel-guest {
  text-align: right;
}

.userpanel-guest a {
  color: #00aeef;
  text-decoration: none;
}

.userpanel-guest a:hover {
  color: #fff;
}

/* --- выбор города в шапке (assets/.../js/city.js) --- */
.yourcity {
  position: relative;
}

#citiesSelection {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 300;
  width: 320px;
  margin-top: 8px;
  padding: 10px;
  background: #fff;
  border: 1px solid #d5d5d5;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
  text-align: left;
}

#citiesSelection.hidden {
  display: none;
}

#citiesSelection .city-search {
  width: 100%;
  height: 34px;
  box-sizing: border-box;
  padding: 0 10px;
  margin-bottom: 8px;
  border: 1px solid #d5d5d5;
  font-size: 14px;
}

#citiesSelection .searchResults {
  max-height: 280px;
  overflow-y: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

#citiesSelection .searchResults .item a {
  display: block;
  padding: 6px 8px;
  color: #191919;
  text-decoration: none;
}

#citiesSelection .searchResults .item a:hover {
  background: #f0f0f0;
}

#citiesSelection .searchResults .region {
  margin-left: 8px;
  color: #9e9e9e;
  font-size: 12px;
}


/* --- страницы входа и регистрации (reg/login_v2.tpl, reg/reg_form_v2.tpl) --- */
.auth-page {
  width: 460px;
  margin: 45px auto 70px;
  padding: 32px 36px 36px;
  background: #fff;
  border: 1px solid #e4e4e4;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
}

.auth-head {
  margin-bottom: 22px;
}

.auth-title {
  font-size: 28px;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.auth-subtitle {
  font-size: 14px;
}

.auth-field {
  display: block;
  margin-bottom: 16px;
}

.auth-label {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
  color: #626262;
}

.auth-input {
  width: 100%;
  height: 42px;
  box-sizing: border-box;
  padding: 0 12px;
  border: 1px solid #d5d5d5;
  background: #fff;
  font-size: 15px;
}

.auth-input:focus {
  border-color: #00aeef;
  outline: none;
}

.auth-remember {
  display: block;
  margin: 4px 0 20px;
  font-size: 14px;
  cursor: pointer;
}

.auth-remember input {
  vertical-align: middle;
  margin-right: 6px;
}

.auth-submit {
  width: 100%;
  border: 0;
  cursor: pointer;
}

.auth-links {
  margin-top: 18px;
  font-size: 14px;
  text-align: center;
}

.auth-sep {
  margin: 0 8px;
}

.auth-error {
  margin-bottom: 16px;
  padding: 10px 14px;
  background: #fdecec;
  border: 1px solid #f3bcbc;
  color: #a12222;
  font-size: 14px;
}

.v2-messages {
  margin-bottom: 18px;
}

.v2-msg {
  margin-bottom: 8px;
  padding: 10px 14px;
  font-size: 14px;
  border: 1px solid #d5d5d5;
  background: #f7f7f7;
}

.v2-msg-ok {
  border-color: #b6ddb6;
  background: #eef8ee;
  color: #1f6b1f;
}

.v2-msg-warn {
  border-color: #f0d9a0;
  background: #fdf6e6;
  color: #8a6100;
}

.v2-msg-err {
  border-color: #f3bcbc;
  background: #fdecec;
  color: #a12222;
}

.auth-mark {
  display: block;
  margin-top: 4px;
  min-height: 14px;
  font-size: 12px;
}

.auth-mark .red {
  color: #c22;
}

.auth-mark .accept_a,
.auth-mark .markdel_a,
.auth-mark .running_a {
  display: inline-block;
  width: 14px;
  height: 14px;
}

.auth-hint {
  margin: -6px 0 16px;
}

.auth-hint-link {
  font-size: 13px;
}

.auth-hint-body {
  margin-top: 8px;
  padding: 10px 12px;
  background: #f7f7f7;
  border: 1px solid #e4e4e4;
  font-size: 13px;
  line-height: 1.45;
}

.auth-captcha-row {
  display: flex;
  align-items: center;
}

.auth-captcha-row img {
  border: 1px solid #e4e4e4;
}

.auth-captcha-reload {
  margin-left: 12px;
  font-size: 13px;
}

.auth-page .auth-input.mt10 {
  margin-top: 10px;
}

.auth-page-wide {
  width: 720px;
}

.auth-text {
  margin-bottom: 24px;
  font-size: 15px;
  line-height: 1.55;
}

.auth-text p {
  margin-bottom: 12px;
}

/* ==========================================================================
   ДИЗАЙН-ЭТАЛОН-1 (DESIGN-APPLY, 23.09.2026)
   Согласованный эталон Дизайна 4 — общие правила нового дизайна.
   Это единственная точка правки акцента и общих элементов интерфейса.
   Справочник: _clubber/_design_src/ЭТАЛОН_элементов.md, отчёт — ОТЧЁТ_дизайн_эталон.md.

   Акцент эталона: #00aeef (на сайте был #41abe1).
   Производные: hover/тёмный #0099d2, «таблетка» #d0f2ff, светлая подложка #eaf8fd.

   ВАЖНО: значения продублированы литералами, а не только var(). Старые браузеры
   (без поддержки CSS-переменных) иначе потеряли бы рамки и цвета целиком.
   Переменные ниже — для нового кода; при смене акцента править и их, и литералы
   (одной командой: python _clubber/_da_accent.py apply).
   ========================================================================== */

:root {
  --cb-accent: #00aeef;
  --cb-accent-hover: #0099d2;
  --cb-accent-tint: #d0f2ff;
  --cb-accent-tint-2: #eaf8fd;
  --cb-navy: #00121a;
  --cb-cover-base: #0e0c14;
  --cb-gold: #ffc20e;
  --cb-badge: #f24841;
  --cb-error: #c92a2a;
  --cb-gray-dark: #555555;
  --cb-gray: #999999;
  --cb-hint: #8a949c;
  --cb-border: #d5d5d5;
  --cb-divider: #d0d0d0;
  --cb-btn-height: 35px;
}

/* --- п.5: у всех кнопок одна высота — как у эталонной .ro-button ----------
   Эталон .ro-button: рамка 2 px, радиус 4 px, кегль 16, padding 6/5,
   интерлиньяж 20 → высота ровно 35 px. Приводим к ней все размерные варианты
   (.ro-button-med, .ro-button-large, .ro-button-small) — они отличались высотой
   31…46 px и на одной странице выглядели разнокалиберно.
   box-sizing: border-box — чтобы высота не зависела от толщины рамки. */
html body .ro-button,
html body .ro-button-cyan,
html body .ro-button-cyan-w-bg,
html body .ro-button-cyan-inv,
html body .ro-button-lightblue,
html body .ro-button-active,
html body .ro-button-highlight,
html body .ro-button-med,
html body .ro-button-large,
html body .ro-button-small,
html body .ro-button-fw,
html body .ro-button-block,
html body .button-box {
  box-sizing: border-box;
  height: 35px;
  min-height: 35px;
  line-height: 20px;
  padding-top: 6px;
  padding-bottom: 5px;
}

/* у модификаторов сохраняем их ширину, но не высоту */
html body .ro-button-med {
  font-size: 14px;
}

html body .ro-button-small {
  padding-left: 10px;
  padding-right: 10px;
}

/* --- п.8: кнопка «Написать об ошибке» в подвале — как в макете -------------
   В макете это .ro-button: рамка 2 px акцентом, радиус 4 px, контурная.
   Было .button-box — рамка 3 px и без скругления. */
html body .button.button-box,
html body .button.button-box-blue {
  display: inline-block;
  box-sizing: border-box;
  height: 35px;
  min-height: 35px;
  line-height: 20px;
  padding: 6px 18px 5px;
  border: 2px solid #00aeef;
  border-radius: 4px;
  background-color: #fff;
  color: #00aeef;
  text-decoration: none;
}

html body .button.button-box:hover,
html body .button.button-box-blue:hover {
  background-color: #00aeef;
  border-color: #00aeef;
  color: #fff;
}

/* --- п.3: плашки ----------------------------------------------------------
   Успех и подсказка — акцент эталона #00aeef (было зелёное #2f9e44),
   ошибка остаётся красной. Мягкие плашки (.v2-msg-*) — светлый акцент. */
html body .umessage_info_div,
html body .umessage_alert_div {
  background-color: #00aeef;
}

html body .umessage_error_div {
  background-color: #c92a2a;
}

html body .v2-msg-ok {
  border-color: #8fdcf7;
  background: #eaf8fd;
  color: #0a6b8f;
}

html body .v2-msg-err {
  border-color: #f3bcbc;
  background: #fdecec;
  color: #a12222;
}

html body .auth-notice {
  border-color: #8fdcf7;
  background: #eaf8fd;
  color: #0a6b8f;
}

/* плашка подтверждения телефона — успех, поэтому акцент */
html body .cb-max-phone-ok {
  background-color: #00aeef;
}

/* --- п.3 (продолжение): подсказки — бледный шрифт, как сейчас ------------- */
html body .auth-hint,
html body .auth-hint-body,
html body .cb-hint,
html body .cb-max-phone-note {
  color: #8a949c;
}

/* --- п.7: шапка — только шрифты и цвета из макета, структура не меняется ---
   В макете пункты меню 16 px (на сайте стоял .font18 — 18 px), вторичные
   подписи «Мы в:»/«Ваш город:» — серые #999 (было #555).
   Разметку header_v2.tpl не трогаем: правила идут через CSS, специфичность
   выше инлайнового <style> шапки (html body ... вместо #header ...). */
html body #header #headerMenu li a {
  font-size: 16px;
  line-height: 20px;
}

html body #header .cb-head-top .darkgray-col,
html body #header .yourcity .darkgray-col {
  color: #999999;
}

html body #header .cb-search-input:focus {
  border-color: #00aeef;
}

/* кнопки рядом с именем персоны (persona_ui.css сужает их до 31 px) —
   п.5 требует одну высоту у всех кнопок */
html body .cb-up-title-actions .ro-button {
  box-sizing: border-box;
  height: 35px;
  min-height: 35px;
  line-height: 20px;
  padding-top: 6px;
  padding-bottom: 5px;
  font-size: 14px;
}

/* ==========================================================================
   TYPE-FRAMES: рамка аватарки по типу персоны.

   Палитра (status_id => цвет) — та же, что рисовал старый дизайн:
   user/avatar.php (строки 36-49), lib/userlib.php:save_user_avatar_all()
   (строки 974-987), style/user/user_xhtml.css (.st1-.st13, строки 317-337),
   place/place_settings.tpl (строки 562/583/1020).

   Рисуем outline с отрицательным отступом: рамка ложится ВНУТРЬ картинки,
   не добавляет ни пикселя к размеру элемента и потому не сдвигает сетку
   (5 карточек в ряд остаются на месте). box-shadow:inset для <img> не
   годится — тень рисуется ПОД содержимым и на картинке не видна (проверено
   снимком _clubber/_tf_shots/css_test_view.png).

   Класс подставляет модификатор cb_frame (lib/framelib.php).
   ========================================================================== */
.cb-frame-st1  { outline: 2px solid #c3c3c3; outline-offset: -2px; }
.cb-frame-st2  { outline: 2px solid #cb3af1; outline-offset: -2px; }
.cb-frame-st3  { outline: 2px solid #01eeff; outline-offset: -2px; }
.cb-frame-st4  { outline: 2px solid #01b7ff; outline-offset: -2px; }
.cb-frame-st5  { outline: 2px solid #3300ff; outline-offset: -2px; }
.cb-frame-st6  { outline: 2px solid #a4ff04; outline-offset: -2px; }
.cb-frame-st7  { outline: 2px solid #ff00ce; outline-offset: -2px; }
.cb-frame-st8  { outline: 2px solid #00ef60; outline-offset: -2px; }
.cb-frame-st9  { outline: 2px solid #ff1200; outline-offset: -2px; }
.cb-frame-st10 { outline: 2px solid #ffcc00; outline-offset: -2px; }
.cb-frame-st11 { outline: 2px solid #fcff00; outline-offset: -2px; }
.cb-frame-st12 { outline: 2px solid #c7007f; outline-offset: -2px; }
.cb-frame-st13 { outline: 2px solid #e18427; outline-offset: -2px; }