@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');

body {
	font-family: 'Roboto', 'Arial', sans-serif;
	font-size: 14px;
	color: #000;
	padding: 0px;
	margin: 0px;
	background: #ffffff;
	-webkit-font-smoothing: antialised;
	text-rendering: optimizeLegibility;
}

b, strong{
	font-weight: 600;
}

.menu_item{
	font-weight: 600; 
	color:#000;
}

@supports (-webkit-touch-callout: none) {
	b, strong{
		font-weight: 400 !important;
	}
	.menu_item{
		font-weight: 400 !important;
	}
}

.cat_bg {
	color: #999;
	fill: #999;
}

.cat_left {
	width: 25px;
}

.cat_padd_left {
	padding-left: 25px;
}

@media all and (max-width: 900px) {
	.cat_padd_left {
		padding-left: unset;
	}
}

.cat_button {
	position: relative;
	cursor: pointer;
	border: none;
	text-decoration: none;
}

.cat_button_height,
.cat_button_reserve_height {
	height: 40px;
}

.cat_button_font_size,
.cat_button_reserve_font_size {
	font-size: 12px;
}

.cat_button .cen {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	white-space: nowrap;
}

.cat_button.gab {
	padding: 10px 15px;
}

.l_10{ margin-left: 10px; }

.cat_button.mar {
	margin: 0px 10px 10px 0px;
}

.cat_button.abs {
	position: absolute;
}

.cat_button:disabled,
.cat_button[disabled] {
	cursor: not-allowed;
	opacity: 0.33;
}

.cat_input {
	position: relative;
	padding: 5px 15px;
	border-radius: 3px;
	font-size: 14px;
	border: none;
	box-sizing: border-box;
}

.cat_a {
	text-decoration: underline;
	color: #69C;
	cursor: pointer;
}

.cat_bord {
	box-shadow: 0 0 0 1px #57B;
	background: none;
	border: none;
}

.cat_bord:hover {
	box-shadow: 0 0 0 1px #57B;
}

.cat_but_sys:hover{
	box-shadow: 0 0 0 1px #999 !important;
	fill: #999;
}
.cat_but_sys{
	box-shadow: 0 0 0 1px #c2c2c2 !important;
	fill: #c2c2c2;
}

.cat_bord_adminpanel {
	color: #57B;
	fill: #57B;
	box-shadow: 0 0 0 1px #57B;
	background: none;
	border: none;
}

.cat_bord_adminpanel:hover {
	color: #359;
	fill: #359;
	box-shadow: 0 0 0 1px #359;
}

.cat_borover {
	box-shadow: none;
}

.cat_borover:hover {
	box-shadow: 0 0 0 1px #57B;
}

.cat_exit {
	box-shadow: 0 0 0 1px #BBB;
	color: #BBB;
	fill: #BBB;
	border: none;
	background: #FFF;
}

.cat_exit:hover {
	box-shadow: 0 0 0 1px #999;
	color: #999;
	fill: #999;
}

.cat_fill {
	border: none;
}


.cat_fill_adminpanel {
	background: #69C;
	fill: #FFF;
	color: #FFF;
	border: none;
}

.cat_fill_adminpanel:hover {
	background: #57B;
}

.cat_fill_white {
	fill: #FFF;
	color: #FFF;
}

.cat_fill_white:hover {
	background: #57B;
}

.cat_fill_invert {
	background: #FFF;
	border: none;
}
.cat_fill_invert:hover {
	color: #FFF;
	fill: #FFF;
}

.cat_btn_white_close {
	position: relative;
	cursor: pointer;
	color: #C5C6C6;
	fill: #C5C6C6;
	box-shadow: 0 0 0 1px #C5C6C6;
	border-radius: 3px;
	font-weight: normal;
	text-decoration: none;
}
.cat_btn_white_close:hover {
	color: #B2B3B3;
	fill: #B2B3B3;
	box-shadow: 0 0 0 1px #B2B3B3;
}

.cat_ctrl {
	color: #000;
	fill: #000;
	background: rgb(255, 204, 17);
	box-shadow: 0 0 0 1px rgb(255, 204, 17);
}

.cat_ctrl:hover {
	background: rgb(255, 212, 50);
}

.cat_have {
	color: #000;
	fill: #000;
	background: #EE6;
}

.cat_void {
	box-shadow: none;
	color: #777;
	fill: #777;
	border: none;
}

.cat_void:hover {
	color: #555;
	fill: #555;
}

.cat_grey {
	background: #FFF;
	box-shadow: 0 0 0 1px #E2E2E2;
	fill: #555;
	color: #555;
	border: none;
}

.cat_grey:hover {
	background: #F9F9F9;
	fill: #000;
	color: #000;
}

.cat_ftint {
	color: #57B;
	fill: #57B;
}

.cat_fgrey {
	color: #777;
	fill: #777;
}

.cat_farow {
	color: #CCC;
	fill: #CCC;
}

.cat_shadow {
	box-shadow: 0 0 3px 1px #CCC;
}

.cat_icons {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 32px;
	height: 32px;
	transform: scale(1) translate(-50%, -50%);
}

.cat_wwmark {
	position: absolute;
}

#genplan.cat_wwmark {
	position: relative;
}

.cat_wwmark .dot {
	fill: #FFF;
	stroke: #C30;
	stroke-width: 16;
}

.cat_wwmark .view {
	fill: #feed00
}

.cat_crminit {
	display: none;
}

/* _______LABELS_______ */

.cat_label {
	position: absolute;
	width: 0px;
	height: 0px;
}

.cat_label .ico {
	position: absolute;
	cursor: pointer;
}

.cat_label:hover .ico {
	cursor: pointer;
}

.cat_label .ani {
	position: relative;
}

.cat_label:hover .ani {
	position: relative;
}

@keyframes cat_label_ani {
	0% {
		bottom: 0px;
	}

	50% {
		bottom: 9px;
	}

	100% {
		bottom: 0px;
	}
}

/* _______SVG_______ */

.cat_svg {
	cursor: pointer;
	stroke-width: 0.0;
}

.cat_svg.lev:hover {
	stroke-width: 5;
	fill-opacity: 0.5;
	z-index: 99;
}

.cat_svg.bg_0 {
	stroke: #aaaaaa;
	fill: #eeeeee;
	fill-opacity: 0.75;
	z-index: 1;
}

.cat_svg.bg_1 {
	stroke: rgb(154, 231, 158);
	fill: rgb(154, 231, 158);
	fill-opacity: 0;
	z-index: 1;
}

.cat_svg.bg_1:hover {
	fill-opacity: 0;
}

.cat_svg.bg_2 {
	stroke: #f5eb8f;
	fill: #faf5c3;
	fill-opacity: 0.75;
	z-index: 1;
}

.cat_svg.bg_3,
.cat_svg.bg_4,
.cat_svg.bg_5,
.cat_svg.bg_6 {
	stroke: #aaaaaa;
	fill: #eeeeee;
	fill-opacity: 0.75;
	z-index: 1;
}

.cat_svg.bg_access {
	fill-opacity: 0;
	z-index: 1;
}
.cat_svg.bg_min {
	fill-opacity: 0.75;
	z-index: 1;
}
.cat_svg.bg_min:hover {
	fill-opacity: 0.5;
}
.cat_svg.bg_access:hover {
	fill-opacity: 0;
}

.cat_svg.fasad {
	fill: var(--CS_areafasad_fill);
	stroke: var(--CS_areafasad_stroke);
	stroke-width: 0;
	fill-opacity: 0;
}

.cat_svg.fasad:hover {
	stroke-width: 2;
	fill-opacity: 0.5;
}

.cat_svg.genplan {
	fill: var(--CS_areagenplan_fill);
	stroke: var(--CS_areagenplan_stroke);
	stroke-width: 0;
	fill-opacity: 0;
}

.cat_svg.genplan:hover {
	stroke-width: 2;
	fill-opacity: 0.5;
}

.cat_svg.level {
	fill-opacity: 0;
	z-index: 1;
}

.cat_svg.level:hover {
	stroke-width: 5;
	fill-opacity: 0;
}

.cat_svg.grey {
	stroke: #CCC;
	stroke-width: 0;
	fill: #EEE;
	fill-opacity: 0;
}

.cat_svg.grey:hover {
	stroke-width: 2;
	fill-opacity: 0.5;
}

.cat_svg.select {
	stroke-width: 5;
	fill-opacity: 0.25;
}

/* _______CHESS_______ */

.cat_chess {
	position: relative;
}

.cat_chess sup {
	font-size: 6px;
}



/* _______MENU_______ */

.cat_menu,
.cat_menu_adminpanel {
	position: relative;
	display: inline-block;
	padding: 6px;
	margin: 0px;
	cursor: pointer;
	text-decoration: none;
}

.cat_menu_adminpanel {
	color: #000;
}

.cat_menu.cel,
.cat_menu_adminpanel.cel {
	position: relative;
	display: table-cell;
	padding: 0px;
	vertical-align: middle;
}

.cat_menu label,
.cat_menu_adminpanel label {
	cursor: pointer;
}

.cat_menu:hover>.fake,
.cat_menu_adminpanel:hover>.fake {
	display: block;
}

.cat_menu input[type="radio"],
.cat_menu_adminpanel input[type="radio"] {
	display: none;
	margin: 0;
	padding: 0;
}

.cat_menu .fake,
.cat_menu_adminpanel .fake {
	position: absolute;
	display: none;
	left: 0px;
	bottom: 0px;
	width: 100%;
	height: 3px;
	z-index: 1;
}

.cat_menu.select .fake,
.cat_menu_adminpanel.select .fake {
	display: block;
}

.cat_menu .fake::before,
.cat_menu_adminpanel .fake::before {
	content: "";
	position: absolute;
	display: block;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}

.cat_menu_adminpanel .fake::before {
	background: #69C;
}

.cat_menu input[type="radio"]:checked~.fake,
.cat_menu_adminpanel input[type="radio"]:checked~.fake {
	display: block;
}

/* _______MENUP_______ */

.cat_menup {
	cursor: pointer;
	color: #DDD;
	white-space: nowrap;
	padding: 0px 7px 0px 0px;
}

.cat_menup .fake {
	position: absolute;
	display: none;
	left: 0px;
	bottom: 0px;
	width: 100%;
	height: 5px;
	background: #69C;
	z-index: 2;
}

.cat_menup:hover .fake {
	display: block;
}

.cat_menup input:checked~.fake {
	display: block;
}

/* _______ANOTHER_______ */

.cat_com {
	display: ruby;
}

.cat_scrollbar {
	overflow: auto;
}


/* полоса прокрутки (скроллбар) */
.cat_scrollbar::-webkit-scrollbar {
	width: 3px;
}

/* ползунок скроллбара */
.cat_scrollbar::-webkit-scrollbar-track {
	background: #D9D9D9;
}

.cat_scrollbar::-webkit-scrollbar-thumb {
	background-color: #E7E7E7;
}


.cat_btnplalist {
	font-size: 12px;
}

/* _______SLIDER_______ */

.ui-slider {
	position: relative;
	background: rgb(124, 124, 124);
}

.ui-slider .ui-state-default,
.ui-slider .ui-widget-header .ui-state-default {
	border: none;
	background: rgb(85, 119, 187);
	border-radius: 50%;
}

.ui-slider .ui-slider-handle {
	position: absolute;
	outline: none;
	z-index: 2;
	width: 16px;
	height: 16px;
	cursor: pointer;
	touch-action: none;
}

.ui-widget-content {
	background-color: rgb(210, 210, 210);
	height: 3px;
}

.ui-widget-header {
	position: absolute;
	background-color: rgb(102, 153, 204);
	height: 3px;
}

.ui-slider-horizontal {
	height: 3px;
}

.ui-slider-horizontal .ui-slider-handle {
	top: -7px;
	margin-left: -8px;
}

.ui-slider-vertical {
	width: 3px;
}

.ui-slider-vertical .ui-slider-handle {
	left: -7px;
	margin-bottom: -8px;
}

/* _______MEDIA_______ */

@media all and (max-width: 900px) {
	.cat_icons {
		transform: scale(0.5) translate(-100%, -100%);
	}

	.cat_icons.t {
		transform: scale(0.75) translate(-75%, -75%);
	}

	.cat_com {
		display: none !important;
	}

}

.cat_hint {
	padding: 10px 10px;
	background: #FFF;
	color: #f17f15;
	line-height: 1.5
}


/* панель фильтров */
@media (min-width: 901px) {
	.btn_filter_panel_block {
		display: none;
	}
}

/* /панель фильтров */

.animated {
	transition: all 0.5s cubic-bezier(0, .5, .5, 1);
}

.cat_adm_passive {
	opacity: 0.4;
}

.cat_adm_active {
	opacity: 1;
}

.cat_hint_monochrome {
	background-color: #000;
	color: #fff;
	line-height: 1.5;
	padding: 0.8em;
}

.adm_btn {
	padding: 5px 8px;
	cursor: pointer;
	box-shadow: 0 0 0 1px #bbb;
	border-radius: 3px;
}

.adm_btn:hover {
	background: #eee;
	/*box-shadow: 1px 1px 0 1px #999;*/
	box-shadow: 0 0 0 1px #999;
}

.adm_btn.active {
	/*border: 1px solid black;*/
	box-shadow: 0 0 0 1px #000;
}

.cat_button_new{
	background: #69C;
	color:#fff !important;
	font-weight: bold;
	letter-spacing: 1px;
    text-shadow: 0 0 2px #333;
	padding: 10px 25px !important;
}

html, body {
	height:100%;
}

#wrap_all_cat{
	display: flex;
	flex-direction: column;
	height: 100%;
}

#wrap_body_cat{
	display: flex;
	height: 100%;
    width: 100%;
}

.wrap_bodyp{ 
	margin: 0 10px 10px 10px;
	flex-grow: 1;
}

#left_panel{
	max-width: 180px;
	min-width: 180px;
	width: 100%;
    display: flex;
    flex-direction: column;
	background:#EBECEC;
	color:#000;
	z-index:2;
	padding:27px 0;
	position: fixed;
	top:0;
	left:0;
	height: 100%;
}
.pbg{
    background-color: #EBECEC;
    border-radius:5px;
    min-height: 15px;
    min-width: 15px;
    margin:0 10px;
	position: relative;
    padding: 10px;
    border-radius: 5px;
    font-size: 12px;
    white-space: nowrap;
	line-height: 1.5;
}


#body_panel{
	width: 100%;
    flex-grow: 1;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
	margin-left: 180px;
	/* padding-right: 40px; */
}

.left_margin{
	width:60px;
}

#navi_left{
	margin:36px -20px;
}

.a_left_menu {
	width:100%;
	padding:10px 10px 10px 15px;
	display: flex;
	align-items: center;
	justify-content: start;
	box-sizing: border-box;
    position: relative;
}

.a_left_menu.sub::after, .step_end_crm::after {
    position: absolute;
    content: '';
    height: 20px;
    width: 20px;
    right: 15px;
    top: 15px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='svg svg-icon' viewBox='0 0 400 400'%3E%3Cpath d='M197 176l67 -68c10,-9 10,-24 0,-33 -9,-9 -24,-9 -33,0l-108 108c-9,10 -9,24 0,34l108 108c9,9 24,9 33,0 10,-9 10,-24 0,-33l-67 -69c-24,-23 -24,-23 0,-47z'%3E%3C/path%3E%3C/svg%3E");
    transform: rotate(-90deg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 60%;
    transition: 0.3s;
}
.step_end_crm_link:hover{
    border-bottom: 1px solid #fff;
}
.step_end_crm_link:hover{
    border-bottom: 1px solid #222;
}
.step_end_crm{
    position: relative;
    display: inline-block;
}

.step_end_crm::after {
    transform: rotate(180deg);
    top: 4px;
    right: -20px;
}

.a_left_menu.sub{cursor: pointer;}

.a_left_menu.active.sub::after {
    transform: rotate(90deg);
}

.a_left_menu_sub{
    display: none;

    & .item{
        padding:15px 10px 15px 47px;
        display: block;
        text-decoration: none;
        line-height: 1.4;
    }
    & .active{
        font-weight: bold;
    }
}

.a_left_menu_sub.active_sub{display: block;}

.a_left_menu:hover, .a_left_menu_sub>.item:hover {
	background-color: #ddd;
}

.sel_left_menu{
	background-color: #d3d3d3 !important;
    /* text-shadow: 0 1px 1px #fff; */
}

.img_left_menu{
    width: 28px;
	margin:0 5px 2px 0;
}

.line{ 
	display: flex; 
	align-items: center;
}
.support{
	position: absolute;
    bottom: 35px;
}

#box_cat_scroll{ height: 100%; }


/* на смену псевдотаблицам */
.flex_row_l_c {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
}
.flex_row_l_t {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-start;
}
.flex_row_c_c {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
}
.flex_row_c_b {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: flex-end;
}
.flex_row_l_b {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-end;
}
.flex_row_sb_c {	/* вертикаль по центру. горизонталь по краям */
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

.col_gap_5 {
	column-gap: 5px;
}
.col_gap_10 {
	column-gap: 10px;
}
.col_gap_15 {
	column-gap: 15px;
}
.col_gap_20 {
	column-gap: 20px;
}
.row_gap_5 {
	row-gap: 5px;
}
.row_gap_10 {
	row-gap: 10px;
}
.row_gap_15 {
	row-gap: 15px;
}
.row_gap_20 {
	row-gap: 20px;
}

.flex-wrap {
	flex-wrap: wrap;
}
.flex-nowrap {
	flex-wrap: nowrap;
}

.flex_break {
  flex-basis: 100%;
  height: 0;
}
/* /на смену псевдотаблицам */


/* стили для меню "список, карточки, шахматка, шахматка+" */
.menu_list_card_chess {
	border: none;
	box-sizing: content-box;
	display: flex;
	justify-content: center;
	align-items: center;
}
.menu_list_card_chess .passive,
.menu_list_card_chess .active {
	padding-left: 10px;
	padding-right: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Стили для кнопки "назад" */
.backstep_custom {
	display: flex;
	justify-content: start;
	align-items: center;
	cursor: pointer;
}
.backstep_custom .backstep_arrow {
	width:20px;
	height:20px;
	padding-right: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
}
/* /Стили для кнопки "назад" */


/* Области на плане этажа */
.sold_in_arealevel_hint,
.access_in_arealevel_hint,
.booking_in_arealevel_hint,
.reserved_in_arealevel_hint {
	padding:8px 16px;
}

.search_tags_container{
	flex-wrap: wrap; 
	gap: 1em; 
}

@media (max-width: 500px) {
	.form_recovery{
		position: absolute;
		left: 0;
		z-index: 9;
		background: #fff;
		margin: 0;
		height: 100%;
	}
}

.test-catalog-backdrop{
	justify-content: space-around;
    width: 100%;
    position: absolute;
    background: #fff;
    z-index: 99;
    height: calc(100% - 185px);
    top: 180px;
    opacity: 0.7;
}

.test-catalog{
	position: absolute;
	z-index: 100;
	height: 165px;
	top: 180px;
	padding-top: 55px;
	left: 450px;
}
.zag_h1_forms{
	text-align: left;
	font-size: 24px;
	font-weight: bold;
}
.box_form_auth{
	display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding-top: 150px;
	& .zag_h1_forms{text-align: center;}
	& .support_div{text-align: center;}
	& .cat_btn_auth{
		background-color: #69C !important;
		color: #FFF !important;
	}
	& .cat_btn_auth:hover, .cat_btn_auth:focus{
		background: #57b !important;
	}
	& .err_mes{
		color: red;
		height: 25px;
		margin-top: 5px;
		font-size: 12px;
	}
}

.fasad_action_btn{
    padding: 8px 30px;
    cursor: pointer;
    border: solid 1px #898989;
    border-radius: 3px;
	font-size: 13px;
	color: #898989
}

.fasad_action_btn.active{
	background: #C5C6C6;
	color: #333;
}

.fasad_action_btn.btn_left{
	border-right: none;
}

.fasad_action_btn.btn_right{
	border-left: none;
}

#box_err{display: none; text-align: center;}

/* стили для инпута */
.wrap_input_p7{
    & .ex_f13{color: #7F7F7E;}
    margin-bottom: 20px;
}


.cat_left {
	width: var(--desktop-left-margin) !important;
}
.cat_padd_left {
	padding-left: var(--desktop-left-margin);
}

.input_p7{
    height: 40px;
    box-shadow: 0 0 0 1px #DDD;
    color: #222;
    box-sizing: border-box;
    background: none;
    border: none;
    position: relative;
    padding: 5px 15px;
    border-radius: 3px;
    font-size: 14px;
    width: 100%;
    margin-top: 10px;
}