/* Start:/bitrix/templates/catalog_layers/template_styles.css?177575519941461*/
html {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
margin: 0 !important;
padding: 0 !important;
scroll-behavior: smooth;
letter-spacing: .02em;
}


body {
background-color: #f1f1f1;
font-family: Tahoma, Verdana, FreeSans, Geneva, Roboto, sans-serif;
margin: 0 !important;
padding: 0 !important;
}

table {
font-size: 15px;
color: #000000;
border-color: #dddddd;}

table.catalog tr td {
text-align: center;
padding: 7px 7px 7px 7px;
transition: background-color 0.3s ease, color 0.3s ease;
}

table.catalog tr th {
padding: 7px 7px 7px 7px;
}


table.catalog tr:nth-child(even) {
background-color: #f7f8f9;
}

.catalog-element table.catalog tr:nth-child(even) {
background-color: none;
}

table.catalog tr td.left {
text-align: left;
}

/* --- ЗАГОЛОВКИ: ТЕНИ НЕТ (как ты просил) --- */
table.catalog th, 
table.obl th, 
table.small th{
text-shadow: none; /* Убрал тень только здесь */
background-color: #d0d0d0 !important;
color: #000;
} 


table.catalog tr:hover td {
background-color: #e0e0e0; /* Цвет строгий серый */
transition: background-color 0.3s ease, color 0.3s ease;
}

/* --- ЯЧЕЙКИ NONO: ТЕНЬ ЕСТЬ --- */
.catalog-element table.catalog td, .catalog-element table.catalog td:hover, 
table.catalog td.nono, table.catalog td.nono:hover {
background-color: white !important;
color: #000000 !important;
z-index: 2;
cursor: default;
position: relative;
}

/* --- ССЫЛКИ: ТЕНЬ ЕСТЬ --- */
table.catalog tr td a {
display: block;
width: 100%;
font-weight: bold;
font-size: 0.937rem;
transition: font-size 0.3s ease;
text-underline-offset: 4px;
}

table.catalog tr td a span.arrow{
display: inline-block;
position: relative;
text-decoration: none;
padding-right: 5px;
color: #d12a22;
}


table.saturn {
font-size: 12px;
color: black;
line-height: 120%;}

td.saturn {
border-color: #dddddd;
text-align: center;}

td {
border-width: 1px;
border-color: #dddddd;}

th {
border-width: 1px;
border-color: #dddddd;}


table.obl td, table.obl th, table.small td, table.small th {
text-align: center;
}

table.obl td:not([valign="top"]), table.obl th:not([valign="top"]),
table.small td:not([valign="top"]), table.small th:not([valign="top"]) {
vertical-align: middle;
}

h1 {
margin: 0px;
padding: 1rem 0 1rem 0;
font-size: 25px;
text-align: center;}

h1.first {
font-size: 15px;
font-weight: normal;
}

p.first {
font-size: 15px;
font-weight: normal;
margin-top: 0px;
padding-top: 10px;}

h2 {
text-align: center;}

h2.pipal {
text-align: left;
color: #d12a22;
}

h3 {
padding: 0.3rem 0 0.3rem 0;
border: 0px;
margin: 0px;
border: none;
}


h3.important {
padding: 3px 0 3px 0;
border: 0px;
margin: 0px;
border: none;}

div.list {
padding: 0px;
border: 0px;
margin: 0px;
border: none;
font-size: 16px;}


div.list2 {
padding: 0px;
border: 0px;
margin: 0px;
border: none;
font-size: 15px;}

h4 {
font-size: 12px;
padding: 15px 0 0 0;
border: 0px;
margin: 0px;
border: none;
color: #686868;
}

#content a {
color: #000000;
padding: 0px;
border: 0px;
margin: 0px;
border: none;
cursor: pointer;
transition: text-shadow 0.3s ease, color 0.3s ease, font-size 0.3s ease;

}

#content a:hover {
color: #d12a22;
transition: text-shadow 0.3s ease, color 0.3s ease;

}

#content table.catalog td a:hover {
font-size:1.0625rem;
transition: font-size 0.1s ease;
}

a.link {
color: #000000;
padding: 0px;
border: 0px;
margin: 0px;
border: none;}

a.link:hover {
text-shadow: none;
color: #d12a22;
}

img {
padding: 0px;
border: 0px;
margin: 0px;
border: none;}

p {		
padding: 0px;
border: 0px;
margin: 15px 0 15px 0;
border: none;}

div.catalog-section-list ul {
padding: 0px;
margin: 0 0 0 25px;}

div.catalog-section-list h3 {
padding: 3px 0 3px 0;
margin: 0px;
font-size: 15px;}

div.catalog-section-list {
position: relative;
padding: 0px;
left: -25px;}

table.data-table th {
text-align: left;}


li.detail {padding: 0px; margin: 0px;}
ul.detail {padding: 20px; margin: 0px;}

.j-types {position: relative; background-color: #d12a22; color: white; font-weight: bold; padding: 2px 4px 2px 5px; text-shadow: none;}
.j-types2 {position: relative; padding: 2px 4px 2px 5px; display: block;}

pre {	font-family: Tahoma;color: #000000;font-size: 15px; padding: 0px; margin: 0px; }

/* Весь сайт */


#background {
position: absolute;
width: 100%;
height: 451px;
background: #f1f1f1 url(https://promnasos.com/images/templates/vertical.jpg) repeat-x;
}

#site {
position: absolute;
margin-left: -560px;
left: 50%;
width: 1120px;
}


/* Самая рабочая область */


#content {
position: relative;
left: 40px;
top: 10px;
margin: 0 0 10px 0;
width: 1040px;
color: #000000;
font-size: 15px;
padding: 0px;
border: none;
}



/* Белое рабочее поле */


#work_zone {
width: 1120px;
height: 100%;
position: relative;
background-color: white;
padding: 0px;
margin: 0px;
}

#left_shadow_light_grey {
background: url(https://promnasos.com/images/templates/left_shadow_light_grey.jpg) repeat-y;
position: absolute;
width: 10px;
height: 100%;
}		

#right_shadow_light_grey {
background: url(https://promnasos.com/images/templates/right_shadow_light_grey.jpg) repeat-y;
width: 10px;
height: 100%;
position: absolute;
left: 1110px;
}		


/* Выезжающее меню */

div.invisible, div.zvHide {
position: relative;
display: none;
width: 100%;}

div.visible {
position: relative;
width: 100%;
display: none;}

div.invisible_image {
width: 100%;
display: none;}

div.visible_image {
width: 100%;
display: none;}

div.invisible_table {
width: 100%;
display: none;}

div.visible_table {
width: 100%;
display: none;}

div.visible_table2 {
width: 100%;}

div.visible, div.invisible, div.invisible_image, div.visible_image, div.invisible_table, div.visible_table2, div.visible_table, div.menu, div.zvHide {
padding: 0px;
margin: 0px;
border: 0px;
width: 100%;
}

div.menu {
position: relative;
display: block;
height: auto;
width: 25px;
float: left;
color: #d12a22;
}

div.menu:hover {
position: relative;
display: block;
height: auto;
width: 25px;
float: left;
color: #d12a22;
}

span.menu {
color: #d12a22;
}

a:hover h3 {margin-left: 12px;
transition: margin-left 0.3s ease;
}

a h3 {
	margin-left: 0px;
	transition: margin-left 0.3s ease;
    display: flex !important;
    align-items: center; 
    gap: 10px;
    position: relative;
}

div.menu2 {
position: relative;
display: block;
height: auto;
width: 25px;
float: left;
color: #d12a22;
top: 4px;
}

/* Логотип */



#logo {
display: block;
background-image: url(https://promnasos.com/images/templates/layers1120.jpg);
width: 1120px;
height: 106px;
position: relative;
background-position: 0px 0px;
}



a.logo {
display: block;
width: 346px;
height: 76px;
position: absolute;
left: 30px;
cursor: pointer;
top:13px;
border-bottom-width:10px;
border-bottom-color:white;

}

img.logo  {
display: block;
width: 346px;
height: 76px;
position: absolute;
cursor: pointer;
border-bottom-width:10px;
border-bottom-color:white;}

a.logoZ {
display: block;
width: 346px;
height: 5px;
position: absolute;
left: 30px;
cursor: none;
background-color: white;
top:89px;
border-bottom-width:10px;
border-bottom-color:white;

}

a.logo2 {
display: block;
width: 250px;
height: 43px;
position: absolute;
left: 840px;
cursor: pointer;
border: none;
color: #d12a22;
text-decoration: none;
font-size: 23.5px;
background-color: #f1f1f1;
font-weight: bold;
top: 10px;
text-shadow: #b9b9b9 2px 2px 4px;
}

a.logo3 {
display: block;
width: 250px;
height: 30px;
position: absolute;
left: 842px;
cursor: pointer;
border: none;
color: #d12a22;
text-decoration: none;
font-size: 22px;
background-color: #f1f1f1;
font-weight: bold;
top: 44px;
text-shadow: #b9b9b9 2px 2px 4px;
}


/* Форма поиска */

#search_form {
position: absolute;
width: 238px;
height: 26px;
top: 46px;
left: 674px;
}



/* Слой с кнопками */


#buttons {
width: 1120px;
height: 53px;
background-color: white;}

#left_buttons_1 {
background-image: url(https://promnasos.com/images/templates/left_side_under_head.jpg);
width: 10px;
height: 53px;
position: absolute;
}

#right_buttons_1 {
background-image: url(https://promnasos.com/images/templates/right_side_under_head.jpg);
width: 10px;
height: 53px;
position: absolute;
left: 1110px;	
}




/* Слайдшоу */


#slideshow_all {
height: 225px;
width: 1120px;
background-color: white;
position: relative;}

#left_shadow_grey {
background: url(https://promnasos.com/images/templates/left_shadow_grey.jpg) repeat-y;
width: 10px;
height: 225px;
position: absolute;
}

#right_shadow_grey {
background: url(https://promnasos.com/images/templates/right_shadow_grey.jpg) repeat-y;
width: 10px;
height: 225px;
position: absolute;
left: 1110px;
}

#slideshow-container {
width: 1040px;
height: 200px;
padding: 0px;
border: 0px;
margin: 0px auto;
cursor:pointer;
position: absolute;
top: 12px;
left: 40px;
}

img.class {
width: 1040px;
height: 200px;
}

div#slideshow {
width: 1040px;
height: 200px;
padding: 0px;
margin: 0px;
background: white;
overflow: hidden; /* Allows the slides to be viewed using scrollbar if Javascript isn't available */ 
position: absolute;
z-index: 5;
}


div#slideshow #nav {
display: none;
list-style: none;
position: absolute;
top: 50%;
z-index: 15;
margin: 0px;
margin-top: -50px;
padding: 0px;
cursor:pointer;
}


div#slideshow #nav #prev {
float: left;
margin: 0 0 0 5px;
padding: 0px;
border: 0px;
}

div#slideshow #nav #next {
position: absolute;
left: 1040px;
float: right;
margin: 0 5px 0 0;
padding: 0px;
border: 0px;
}

div#slideshow #nav a {
display: block;
width: 60px;
height: 86px;
text-indent: -9999px;
position: absolute;
}

div#slideshow #nav #prev a {
background: url(https://promnasos.com/images/templates/slideshow/arrows.png) no-repeat;
background-position:left top;left:0;
}

div#slideshow #nav #prev a:hover {
background: url(https://promnasos.com/images/templates/slideshow/arrows.png) no-repeat;
background-position:left bottom;
}

div#slideshow #nav #next a {
background: url(https://promnasos.com/images/templates/slideshow/arrows.png) no-repeat;
background-position:right top;right:0;
}

div#slideshow #nav #next a:hover {
background: url(https://promnasos.com/images/templates/slideshow/arrows.png) no-repeat;
background-position:right bottom;
}

div#slideshow #slides_catalog {
position: absolute;
margin: 0px;
padding: 0px;
list-style: none;}

div#slideshow #slides_catalog li {
margin: 0px;
position: absolute;
padding: 0px;
}


/* Красная зона */


#red_white_1 {
position: relative;
background-image: url(https://promnasos.com/images/templates/layers1120.jpg);
width: 1120px;
height: 28px;
background-position: 0px -106px;
}

#red {
position: relative;
width: 1120px;
height: 25px;
background-color: #db2d24;
}

#red_content {
left: 40px;
position: absolute;
width: 1070px;
height: auto;
margin: 3px 0 0 0;
font-size: 17px;}

#left_shadow_red {
background: url(https://promnasos.com/images/templates/left_shadow_red.jpg) repeat-y;
height: 25px;
width: 10px;
position: absolute;
}

#right_shadow_red {
background: url(https://promnasos.com/images/templates/right_shadow_red.jpg) repeat-y;
height: 25px;
width: 10px;
position: absolute;
left: 1110px;
}

#red_white_2 {
position: relative;
background-image: url(https://promnasos.com/images/templates/layers1120.jpg);
width: 1120px;
height: 28px;
background-position: 0px -134px;
}


/* Конец */


#end {
background-image: url(https://promnasos.com/images/templates/layers1120.jpg);
width: 1120px;
height: 38px;
background-position: 0px -162px;
}

#copyright {
width: 1120px;
position: relative;
font-size: 12px;
text-align: center;
color: #686868;
top: -10px;
padding: 0px;
margin: 0px;}

/* таблица расшифровки обозначений Argal */


table.small td, table.small th, table.obl td, table.obl th {
padding: 5px 5px 5px 5px;
font-size: 14px;
}

td.argal {
font-size: 15px !Important;
color: white !Important;
background-color: #d12a22 !Important;
padding-top: 10px !Important;
padding-bottom: 10px !Important;
text-shadow: none !important;
} 


/* таблица распилов погружных Varisco */

table.varisco_raspil {
font-size: 12px;
}

/* аякс подгрузка описания */

/* 1. Базовая видимость */
div.zvHide, div.invisible, div.visible, div.invisible_image, div.invisible_table, div.visible_table, div.invisible_table, div.visible_table { 
display: none; 
overflow: hidden !important; /* Теперь анимация будет плавной везде */
}
div.zvBlock { display: block; }

/* 2. Создаем "лесенку" для всех вложенных элементов */
/* Теперь AFpumps сдвинет "Погружные" на 25px, а те сдвинут "Каталог" еще на 25px */
.zvHide, .zvBlock {
padding-left: 0;
border-left: none !important;
box-sizing: border-box;
}

/* 3. ИСКЛЮЧЕНИЕ ДЛЯ AJAX: чтобы данные занимали все 1040px */
div.zvAjax {
padding-left: 0px !important;
}

/* 4. Фикс шестерёнки (убираем пробел в 10px) */
.zload {
position: absolute;
height: auto;
width: 25px;
padding: 0 0 0 10px; 
margin: 0px;
display: none !important;
}

div.catalog-section a:hover {padding-left: 12px;}

h3.menu:hover {padding-left: 12px;}


a:has(h3) {
text-decoration: none;
display:block;
}

h3:has(a) {
text-decoration: none;
display:block;
}

a.but {
display:block;
width:131px;
height:30px;
background-color: #db2d24;
color: #ffffff;
font-size: 18px;
box-shadow: 3px 3px 5px #aaaaaa;
float:left;
text-align:center;
padding-top: 8px;
text-decoration: none;
text-shadow: #222222 1px 1px 2px ;
border-radius: 7px;
transition: background-color 0.3s ease, color 0.3s ease;
}

a.but:hover {
background-color: #e2e2e2;
color: #000000;
text-shadow: #666666 2px 2px 6px ;
transition: background-color 0.3s ease, color 0.3s ease;

}

div.but-space {
display:block;
height:38px;
width:20px;
float:left;

}

div.buttons2 {
position: absolute;
left: 40px;
display:block;
height:38px
}

td#under {border-bottom-color:black; border-bottom-width:2px;}



/* вкнипка верх*/

#back-to-top {
position: fixed;
bottom: 30px;
left: 30px;
z-index: 9999;
width: 50px;
height: 50px;
text-align: center;
line-height: 46px;
background: #d12a22;
color: white;
cursor: pointer;
border-radius: 50%;
text-decoration: none;
/* Оставляем анимацию только для фона */
transition: background 0.3s; 
font-size: 30px;
box-shadow: 0px 2px 5px rgba(0,0,0,0.3);
display: none; /* jQuery сам включит нужную прозрачность */
}

/* Эффект при наведении — теперь сработает четко */
#back-to-top:hover {
opacity: 1 !important; 
background: #333;
}

#back-to-top.show {
opacity: 0.8;
visibility: visible;
}


/* НАВИГАЦИОННАЯ ЦЕПОЧКА */

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

ul.breadcrumb-navigation li
{
display:inline;
text-shadow: #444444 1px 1px 2px;
color: white;
}

ul.breadcrumb-navigation a
{
color: white;
text-decoration: none;
padding: 0; margin: 0;

}

ul.breadcrumb-navigation a:hover
{
color: white;
text-decoration: underline;
}

ul.breadcrumb-navigation span
{
color: white;
font-size: 16px;
}


input[name="web_form_submit"] {
background-color: #d12a22;
color: white;
padding: 10px 15px 10px 15px;
font-size: 18px;
border: none;
border-radius: 5px;
cursor: pointer;
-webkit-appearance: none;
}

#content table.contacts tr td.short-form {
padding-top: 10px;
}


#content table.contacts input[type="text"], #content table.contacts select[class="inputselect"], #content table.contacts textarea[class="inputtextarea"], #content table.contacts input[type="checkbox"] {
    padding: 3px 5px 3px 5px !important;
    font-size: 18px !important;
margin-top: 5px;
    letter-spacing: .01em;
    font-weight: 500;
    color: #a31621;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Tahoma, Arial, sans-serif;
	    width: 260px;
}


#content label {
position:relative; 
padding-right: 5px;
}

h3.foto {
		padding: 5px 0 5px 0;
		border: 0px;
		margin: 0px;
		border: none;
		font-weight: normal;}
		
/* --- АДАПТИВ (КОПИЯ С ГЛАВНОЙ + ФИКСЫ) --- */
.mobile { display: none; }
.desktop { display: block; }

@media (max-width: 1120px){
.mobile { 
display: block !important; 
padding-top: 50px !important;
background-color: white !important; 
}

.desktop { display: none !important; }

body { background-color: white !important; margin: 0 !important;}

/* Сброс стилей Битрикса */
#site, #work_zone {
position: relative !important;
width: 100% !important;
margin: 0 !important;
left: 0 !important;
background: transparent !important;
padding: 0 !important;
box-shadow: none !important;
}

#content {
position: relative !important;
width: 100% !important;
margin: 0 !important;
left: 0 !important;
top: 0 !important; /* Убрали десктопный сдвиг 10px */
background: white !important;
padding: 10px !important;
box-sizing: border-box;
text-shadow: none !important;
font-size: 1rem !important; /* База. Меньше 16px для сплошного текста делать нельзя */
line-height: 1.5 !important; /* Воздух между строками, глаза не устают */
}

#content h1 { font-size: 1.75rem !important; line-height: 1.2 !important; }
#content h2 { font-size: 1.5rem !important; line-height: 1.25 !important; }
#content h3 { font-size: 1.25rem !important; line-height: 1.0 !important;  padding: 0.4rem 0 0.4rem 0 !important;}

/* ФИКС H1: без тени и выше */
#content h1 {
text-shadow: none !important;
margin-top: 0 !important;
padding-top: 5px !important;
text-align: center !Important;
}

/* === ЗОЛОТОЙ СТАНДАРТ ШАПКИ (ВСТАВИТЬ В ОБА ФАЙЛА) === */
.sticky-header {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
background: #f1f1f1;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
padding: 0.5rem 0.7rem;
box-sizing: border-box !important;
height: 50px;
display: flex;
align-items: center;
border-bottom: 1px solid #aaa;
}

.top-row {
display: flex;
align-items: center;
width: 100%;
gap: 0.5rem; /* Единый зазор для всех страниц */
}

.hamburger {
display: inline-flex;
align-items: center;
justify-content: center;
background: none;
border: none;
cursor: pointer;
padding: 0; 
width: 30px;
height: 44px;
-webkit-tap-highlight-color: transparent;
outline: none;
transition: transform 0.3s ease-in-out;
font-size:1.5rem;
}


.hamburger.is-active {transform: rotate(90deg);}

.contact {
display: flex;
gap: 0.5rem;
white-space: nowrap;
margin-left: auto; /* Прижимает к правому краю */
font-size: clamp(0.75rem, -0.15rem + 4.5vw, 1.2rem);
}

.contact a {
color: #000;
text-decoration: none;
}

/* === УМНОЕ МЕНЮ (ИДЕНТИЧНОЕ) === */
.main-nav {
position: absolute;
top: 50px;
left: -400px;
background: #f1f1f1;
z-index: 999;
transition: left 0.3s ease-in-out;
}

.main-nav.open {
  border-right: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
  left: 0px;
  transition: left 0.3s ease-in-out;
}

.main-nav ul {
display: flex;
flex-direction: column;
max-height: 0;
opacity: 0;
overflow: hidden;
list-style: none;
padding: 0;
margin: 0;
}

.main-nav.open ul {
max-height: 1000px;
opacity: 1;
margin: 0;
padding: 0.5rem 0 0.5rem 0;
}

.main-nav ul li {
margin: 0;
justify-content: center;
padding: 0.5rem 1rem 0.5rem 1rem;
}

.main-nav ul li a {
font-size: 1.2rem;
text-decoration: none;
display: block;
color: #000;
}

#content img {
max-width: 100% !important;
height: auto !important;
width: auto !important;
}

/* Скрываем картинки в h3 */
#content h3 img:not([src*="pdf_doc"]) {display: none !important;}
#content h3 span { top: 0 !important; padding-left: 0px !important; }
#content td a span { display: none !important; }
#content table td.nono {text-shadow: none !important; }
#content table.catalog td a, #content table.catalog td a:hover {transition: none !important;}

#content table {
display: block !important;
/*width: fit-content !important;*/
max-width: 100% !important;
overflow-x: auto !important;
-webkit-overflow-scrolling: touch !important; /* Плавность для смартфонов */
margin-left: auto !important;
margin-right: auto !important;
font-size: 0.9375rem !important;
}

/* 2. Внутренности таблицы (даже если tbody нет в коде, он есть в DOM) 
снова включаются в режим таблицы. Это вернет 100% ширину и починит rowspan */
#content table > tbody, 
#content table > thead {
display: table !important;
width: 100% !important;
box-sizing: border-box !important;
}


/* Делаем футер белым */
.mobile footer {
background: white !important;
}

/* --- ВЕРТИКАЛЬНАЯ КАРТОЧКА ТОВАРА (ТОЧЕЧНО) --- */

#content table.item,
#content table.item tbody,
#content table.item tr,
#content table.item td,
#content td.item-photo{
display: block !important;
max-width: 520px !important;
box-sizing: border-box !important;
white-space: normal !important;
}


/* 2. Оживляем главную картинку */
#content img.detail,  #content td.item-photo img{
width: 100% !important; 
max-width: 520px !important;
margin: 0 !important;
display: block !important;
aspect-ratio: 520 / 338;
object-fit: contain;
}

/* 1. Контейнеры гармошки: плавная анимация без выстрела */
.invisible, .zvHide {
display: none; /* БЕЗ !important, чтобы jQuery мог анимировать */
width: 100% !important;
overflow: hidden; /* Для чистого слайда */
box-sizing: border-box;
}


#content table td{
display: table-cell !important;
width: auto !important;
white-space: nowrap;
}
 
#content table th {
display: table-cell !important;
width: auto !important;
}


/* 1. Делаем контейнер аякса гибким */
div.zvAjax {
width: 100% !important;
padding: 0 !important;
box-sizing: border-box !important;
}

#content [id] {scroll-margin-top: 40px;}

@supports not (scroll-margin-top: 40px) {
#content [id]::before {
content: "";
display: block;
height: 60px;        /* Высота шапки + 10px запаса */
margin-top: -60px;   /* Компенсируем сдвиг верстки */
visibility: hidden;
pointer-events: none;
}
}

.desktop, #work_zone.desktop, #content.desktop {
display: none !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;}

#content video {
width: 100% !important;
height: auto !important; /* Сбрасываем фиксированную высоту 360px */
max-width: 100% !important;
box-sizing: border-box !important;
}

/* Убираем влияние тега <center>, если он мешает центрированию */
#content center {
width: 100% !important;
display: block;
}

/* Складываем таблицу .can в столбик */
#content table.can, 
#content table.can > tbody,
#content table.can > thead, 
#content table.can > thead > tr,
#content table.can > tbody > tr, 
#content table.can > thead > tr > th,
#content table.can > thead > tr > td,
#content table.can > tbody > tr > td,
#content table.can > tbody > tr > th {
display: block !important;
max-width: 100% !important;
box-sizing: border-box !important;
}

#content table.can td, table.can th {
padding: 5px 5px 5px 5px !important;
}

#content table.can{
width: fit-content !important;
}

#content table.can td h3{
text-align: center;
}

#content table.can td img {
display: block !important;
margin: 0 auto !important;
padding: 0 !important;
max-width: 100% !important; /* Теперь это сработает, так как мы убрали max-width: none выше */
width: auto !important;
height: auto !important;
float: none !important;
}

/* Разрешаем перенос текста */
#content table.can td {
white-space: normal !important;
}

.center-mob, a.center-mob, h3.center-mob {
text-align: center !important;
justify-content: center !important;

}

/* Правило для картинок — оставляем как есть */
img.center-mob ,
video.center-mob  {
margin-inline: auto !important;
display: block !important;
justify-content: center !important;

}

/* Правило для таблиц — ИСПРАВЛЯЕМ ТУТ */
table.center-mob  {
margin-inline: auto !important;
justify-content: center !important;

}

table.center-mob  td, table.center-mob td a, table.center-mob td a h3 {
text-align: center !important;
justify-content: center !important;

}
.center-mob h3 {
    display: block !important; /* Отключаем Flexbox */
    text-align: center;       /* Текст по центру */
    gap: normal;              /* Убираем лишний отступ */
}

/*
#content table:not(.item):not(.can) img:not(.detail), 
div.zvAjax table img {
max-width: none !important;
width: auto !important;
}
*/

/* Запрет переноса в первом столбце для всех типов таблиц */
table.catalog th:first-child, 
table.catalog td:first-child {
white-space: nowrap !important;
width: auto !important; /* Даем колонке расшириться под текст */
padding: 10px 10px 10px 10px  !important;
}


ol {padding-left: 20px;}
ul {padding-left: 20px;}

img[style*="float"] {
float: none !important;  /* отключаем обтекание */
display: block !important;  /* делаем блочной */
margin-left: auto !important;  /* эти два margin */
margin-right: auto !important; /* центрируют по горизонтали */
padding: 0 !important;
}

img[align*="right"] {
float: none !important;  /* отключаем обтекание */
display: block !important;  /* делаем блочной */
margin-left: auto !important;  /* эти два margin */
margin-right: auto !important; /* центрируют по горизонтали */
padding: 0 !important;
}

#content table.small td, #content table.small th, #content table.obl td, #content table.obl th {
white-space: normal;
font-size: 0.75rem !important;
line-height: 1.3 !important;}

#content table.wrap td , #content table.wrap th {white-space:normal !important;}

a:hover h3 {margin-left: 0; transition: none;}
a h3 {transition: none;}



#back-to-top {
bottom: 20px;
left: 20px; 
width: 40px;
height: 40px;
line-height: 38px;
font-size: 24px;
}

div.menu {top: -2px !important;}

span.down2 {transform: translateY(-2px);}

/* 2. НАШИ ПОСТАВЩИКИ */
#content table.brands-table tbody {
display: flex !important;
flex-wrap: wrap !important;
justify-content: center !important;
}

#content table.brands-table tr {
display: contents !important;
}

#content table.brands-table td {
display: block !important;
padding: 10px 5px !important;
box-sizing: border-box !important;
vertical-align: top !important;
text-align: center !important;
}

#content table.brands-table td br {
display: none !important;
}

#content table.brands-table img {
width: auto !important;
max-width: 100% !important;
height: auto !important;
margin: 8px auto 0 auto !important;
display: block !important;
}

#content table.brands-table td:empty {
display: none !important;
}

/* БРЕНДЫ */
#content table.brands-list,
#content table.brands-list tr,
#content table.brands-list td {
display: block !important;
width: 100% !important;
box-sizing: border-box !important;
border: none !important;
}

#content table.brands-list td img{
display: block !important;
margin: 0 auto 10px auto !important;
max-width: 100% !important;
height: auto !important;
}

#content table.brands-list tr {
border-bottom: 2px solid black !important;
margin-bottom: 15px !important;
padding-bottom: 10px !important;
}


#content table.brands-list .menu {
display: none !important;
}

#content table.brands-list h3 {
margin: 5px 0 !important;
justify-content: center;
}



/* КОНТАКТЫ */

#content table.contacts tr td {text-decoration: none; font-size: 1.1rem; padding:0 !important; margin-bottom: 20px;}

#content table.contacts tr td.short-form {
display: block !important;
width: 100% !important;
text-align: center !important; /* Центрирует текст и inline-элементы */
padding: 20px 15px 0 15px !important;
box-sizing: border-box !important;
}

#content table.contacts tr td.short-form form div {
text-align: center !important;
margin-left: auto !important;
margin-right: auto !important;
}

#content table.contacts tr td.short-form input[type="submit"] {
margin: 10px auto !important;
display: inline-block !important;
}

#content table.contacts tr td.short-form .inputtext, 
#content table.contacts tr td.short-form .inputtextarea,
#content table.inputtext, 
#content table.inputtextarea {
width: 100% !important; 
max-width: 100% !important;
box-sizing: border-box !important;
display: inline-block !important;
padding: 10px !important;	
font-size: 16px !important;
margin: 10px 0 0 0;
}

#content table.contacts tr td.short-form .inputtextarea {
height: 100px !important;
}

#content table.contacts tr td.short-form form center {
line-height: 1.4 !important;
padding: 10px 0 !important;
text-align: center !important;
}

#content table.contacts tr td.short-form form input[type="checkbox"] {
width: 22px !important;
height: 22px !important;
margin-right: 10px !important;
}

#content table.contacts tr td.short-form form input[name="web_form_submit"] {
background-color: #d12a22 !important;
color: white !important;
padding: 15px !important;
font-size: 18px !important;
border: none !important;
border-radius: 5px !important;
cursor: pointer;
-webkit-appearance: none; /* Фикс для Safari */
    display: block;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}




/* БОЛЬШАЯ ЗАЯВКА */

#content .big-form table.data-table, 
#content .big-form table.data-table tr, 
#content .big-form table.data-table td {
display: block !important;
width: 100% !important;
box-sizing: border-box !important;
text-align: left !important; /* Подписи теперь слева/сверху */
}

/* Настройка отступов для ячеек */
#content .big-form table.data-table td {
padding: 0 !important;
border: none !important;
}

#content .big-form .inputtext, 
#content .big-form .inputtextarea {
display: inline-block !important;
max-width: 100% !important;
}

/* Оформление инпутов и селектов */
#content .big-form table.data-table input[type="text"], 
#content .big-form table.data-table select, 
#content .big-form textarea {
width: 100% !important;
padding: 10px !important;
font-size: 18px !important; /* Убирает автозум в iOS */
border: 1px solid #ccc !important;
border-radius: 4px;
box-sizing: border-box;
letter-spacing: .02em;
font-weight: 700;
		color: #a31621;
}



/* Тестовое поле (textarea) */
#content .big-form textarea {
height: 120px !important;
}

/* Чекбоксы и радиокнопки оставляем в ряд, где это уместно */
#content .big-form table.data-table input[type="checkbox"] {
width: 23px !important;
height: 23px !important;
top: 8px;
position: relative;
margin: 0;
}

#content .big-form table.data-table label {
font-size: 16px;
line-height: 24px;
display: inline-block;
vertical-align: middle;
white-space: wrap;
}

/* Скрываем пустые ячейки-распорки, которые есть в разметке */
#content .big-form table.data-table td:empty {
display: none !important;
}

/* Центрируем капчу и кнопку */
#content .big-form form[name="bolshaya_zayavka"] center {
text-align: left !important; /* На мобилке лучше по левому краю */
}

#content .big-form input[name="web_form_submit"] {
background-color: #d12a22 !important;
color: white !important;
padding: 15px !important;
font-size: 18px !important;
border: none !important;
border-radius: 5px !important;
cursor: pointer;
-webkit-appearance: none; /* Фикс для Safari */
    display: block;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

/* Продвинутое скрытие пустых ячеек-распорок */
#content .big-form  table.data-table td:has(> br:only-child), 
#content .big-form  table.data-table td:empty {
display: none !important;
}

/* Убираем лишние отступы между блоками полей */
#content .big-form  table.data-table tr {
margin-bottom: 0px;
display: block;
}

/* Центрируем блок с капчей и текстом под ней */
#content .big-form form[name="bolshaya_zayavka"] center > div > div {
text-align: center !important;
margin-bottom: 10px !important;
}

/* Увеличиваем шрифт соглашения и делаем его читабельным */
#content .big-form form[name="bolshaya_zayavka"] center center {
font-size: 16px !important; /* Было 12px */
line-height: 1,5 !important;
text-align: left !important; /* Текст лучше читать по левому краю */
padding: 10px 0 !important;
}

/* Делаем чекбокс согласия крупнее, чтобы в него можно было попасть */
#content .big-form #form_checkbox_ok_226 {
width: 22px !important;
height: 22px !important;
margin-right: 10px !important;
}

/* Немного "воздуха" для кнопки отправки */
#content .big-form input[name="web_form_submit"] {
margin-top: 20px !important;
height: 50px !important;
letter-spacing: 1px;
}



/* ЗАЯВКА ТОЛЬКО ПЕРВЫЕ 4 ВОПРОСА */

/* Только для таблиц с классом mobile-inline внутри большой формы */
#content .big-form table.mobile-inline tr {
    display: flex !important;
	align-items: center !important;
}

#content .big-form table.mobile-inline td {
    width: 50% !important;          /* подпись и поле занимают по 50% */
    padding: 0 !important;
    border: none !important;
    box-sizing: border-box !important;
}

/* Скрываем пустые ячейки-распорки */
#content .big-form table.mobile-inline td:empty,
#content .big-form table.mobile-inline td:has(> br:only-child) {
    display: none !important;
}

/* Если в строке осталась одна ячейка (например, с colspan), растягиваем на всю ширину */
#content .big-form table.mobile-inline td:only-child,
#content .big-form table.mobile-inline td[colspan] {
    width: 100% !important;
}

/* Поля ввода занимают всю ширину своей ячейки */
#content .big-form table.mobile-inline input[type="text"],
#content .big-form table.mobile-inline select,
#content .big-form table.mobile-inline textarea {
    width: 100% !important;
    box-sizing: border-box !important;
}


/* НОВОСТИ и ДОКУМЕНТЫ */

p.news-item {
position: relative !important;
padding-left: 170px !important; 
min-height: 125px; 
overflow: hidden; 
clear: both;
}

p.news-item > a:first-child {
position: absolute !important;
left: 0 !important;
top: 0 !important;
}

p.news-item img.preview_picture {
float: none !important;
margin-right: 0 !important;
width: 150px !important;
height: auto !important;
display: block !important;
}

p.news-item {
 line-height: 1.5 !important;
}


div .specs-list {line-height: 1.5 !important;}

.item-data {max-width: 520px !important;}

#content li, #content p {line-height: 1.5 !important;}

.specs-list .prop-item:nth-child(odd) {
  background-color: #f7f8f9;
}

.specs-list .prop-item{
  padding: 2px 7px 2px 7px;
}


.zload {display: none !important;}

.hide, #content table.item td.hide, #content table td.hide, #content table th.hide, #content div.hide, #content p.hide, #content img.hide
{display: none !important;}

#content table.item td.item-data h3  {padding: 1rem 0 1rem 0 !important;}

.prop-data {
font-weight: 700 !important;
}

#content table.catalog td a:hover {
font-size: 0.937rem !important;
transition: none;
}

}


/* ПРАВКА ЛЕНТЫ НОВОСТЕЙ */

@media (max-width: 480px){
/* 1. Сбрасываем контейнер */
#content .news-item {
padding-left: 0 !important; 
min-height: 0 !important;
text-align: center !important;
position: relative !important; /* оставляем relative, но без отступов */
}

/* 2. КРИТИЧНО: Сбрасываем позиционирование ссылки, в которой картинка */
#content .news-item a {
position: static !important; /* Возвращает ссылку в поток (из absolute в static) */
display: block !important;
width: auto !important;
}

/* 3. Настраиваем саму картинку */
#content .news-item img.preview_picture {
position: static !important; 
float: none !important;      /* Убиваем обтекание */
display: block !important;   /* Делаем блоком, чтобы текст ушел вниз */
margin: 30px auto 0px !important;
max-width: 100% !important;
height: auto !important;
width: auto !important;
}
#content .news-item br {
display: none !important;
}



}


.center {
text-align: center;
justify-content: center !important;

}

/* Правило для картинок — оставляем как есть */
.center img,
.center video {
margin-inline: auto;
display: block;
justify-content: center !important;

}

/* Правило для таблиц — ИСПРАВЛЯЕМ ТУТ */
.center table {
margin-inline: auto;
justify-content: center !important;

}

/* Убираем подчеркивание у новых Ajax-ссылок */
a.js-action {
display: block;
border-bottom: none; /* На случай, если там бордер */
}


div.cost a{
text-decoration:none;
}


.prop-item {
cursor: default;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Tahoma, Arial, sans-serif;
}

.prop-title {
color: #555555;
font-weight: 400;
letter-spacing: 0;
font-size:0.95rem;
}

.prop-data {
color: black;
font-weight: 600;
}

.prop-data a {
text-transform: uppercase;
}


#content li, #content p {line-height: 1.4;}
#content table {line-height: 140%;}

#content table.contacts tr td a {text-decoration: none;}





/*
can - перестраивает в вертикаль
center - по центру везде
таблица small - малая
wrap - переносы в ячейках таблиц
center-mob - по центру только на мобиле
hide - скрыть на мобиле
*/

img.detail {
    aspect-ratio: 520 / 338;
    object-fit: contain;
	display: block;
}

h3.top-list {
	display: flex; 
	align-items: center; 
	gap: 10px;
}

.red {color: #d12a22;}
td.red {color: #d12a22;}


#content table.brands-list a {
text-decoration: none;
}

#content h3.selected-h3 {color:#d12a22;}

.grey {color: grey; display: inline;}

.hide_pc, #content table.item td.hide_pc, #content table td.hide_pc, #content table th.hide_pc, #content div.hide_pc, #content p.hide_pc, #content img.hide_pc, #content a.hide_pc
{display: none !important;}



#content .big-form table.data-table input[type="text"], 
#content .big-form table.data-table select, 
#content .big-form textarea {
padding: 10px !important;
font-size: 18px !important; /* Убирает автозум в iOS */
border: 1px solid #ccc !important;
border-radius: 4px;
box-sizing: border-box;
letter-spacing: .01em;
font-weight: 500;
color: #a31621;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Tahoma, Arial, sans-serif;
width: 270px;
margin-top: 2px;
margin-bottom: 2px;
}



#content .big-form textarea.inputtextarea {
width: 100%;
}


/* Оформление инпутов и селектов */
#content .big-form input[name="captcha_word"]
{
padding: 10px !important;
font-size: 18px !important; /* Убирает автозум в iOS */
border: 1px solid #ccc !important;
border-radius: 4px;
box-sizing: border-box;
width: 100px;
margin-left: auto;
margin-right: auto;
text-align:center;
text-transform: uppercase;
letter-spacing: .1em;
font-weight: 700;
color: #a31621;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Tahoma, Arial, sans-serif;

}

#content table.contacts td.short-form input[name="captcha_word"]
{
font-size: 18px !important; /* Убирает автозум в iOS */
box-sizing: border-box;
width: 100px !important;
margin-left: auto;
margin-right: auto;
text-align:center;
text-transform: uppercase;
letter-spacing: .1em;
font-weight: 700;
color: #a31621;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Tahoma, Arial, sans-serif;

}

#content table.contacts td.short-form {line-height: 100%; }
#content table.item td.item-data h3  {padding: 0 0 0.5rem 0; text-align:center;}

#content h3.model-list {
text-align: center; padding: 1rem 0 1rem 0 !important; }

#content table.catalog td:nth-child(2) {
  color: #d12a22;
}

br {
  line-height: 1rem; 
}

hr {background-color: #e5e5e5 !important; border:none;}



.vh {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
/* End */
/* /bitrix/templates/catalog_layers/template_styles.css?177575519941461 */