:root {
	--page-background-color: #f1f1f1;
	--header-background-color: #fff;
	--tile-background-color: #fff;
	--text-color: #444;
	--line-color: #333;
	--button-panel-background-color: #fff;
	--tile-header-background-color: #66d;
	
	--color0: #000000;
	--color1: #f78888;
	--color2: #ffffff;
	--color3: #ececec;
	--color4: #90ccf4;
	--color5: #5da2d5;
	--color6: #f8f8f8;
	--color7: #666666;
}

body, html { 
	font-family: arial, sans-serif;
	font-size: 14px; 
	margin: 0;
}

.nav-tabs { border-bottom: inherit; }

@media screen, print { 

.color1 { color: #a0a0a0 }
.color2 { color: white; }
.color3 { color: #808080; } 
.bColor1 { background-color: #33b1ed; }

.headerBalance { text-align: right; }
.CUR { font-weight: normal; font-family: Helvetica, Geneva, Arial, sans-serif, Verdana; }  
.CUR::before { content: " \20BD"; }  
.sumFrac { font-size: 70%; color: #ccc; }

.pageHeader { 
	background-color: var(--color2);
	top: 0; 
	left: 0; 
	height: 5rem; 
	width: 100vw;	
}
.pageHeader > .content {
	display: grid; 
	grid-template-areas: "logo glue contract buttons"; 
	grid-template-columns: 150px 2fr 4fr 300px; 
	grid-template-rows: 1fr; 
	text-transform: uppercase;
	max-width: 50rem; 
	margin: 5px auto;
}
.logo { display: inline-block; background: url(img/logo.png) no-repeat; height: 50px; width: 100px; }
.pageHeader .logo { grid-area: logo; }
.pageHeader .logo a { display: inline-block; background: url(img/logo.png) no-repeat; width: 100px; height: 54px; }
.pageHeader .contract { grid-area: contract; margin-top: auto; margin-bottom: 5px; text-align: center; }
.pageHeader .balance { grid-area: balance; margin-top: auto; margin-bottom: 5px; text-align: center; }
.pageHeader .buttons { grid-area: buttons; margin-top: auto; margin-bottom: 5px; text-align: right; }
.pageHeader .buttons img { vertical-align: middle; }
.pageHeader .buttons div { display: inline-block; }

.pageMenu { background-color: var(--header-background-color); }
.pageMenu > ul { margin: 10px auto; max-width: 50rem; }

/* div.pageHeader { display: flex; justify-content: space-between; padding: 10px 20px 0px 20px; font-size: 14pt; color: #666; box-sizing: border-box; background-color: #eee; } ; #33b1ed */

.content .buttons { margin-bottom: 0px; }
.content .buttons img { vertical-align: middle; }
.content .buttons > div { display: inline-block; }

.headerMiddle { font-size: 1.5em; }
.borderR10 { border: 1px solid #33b1ed; border-radius: 10px; }
	
.tableWidth { width: 100%; min-width: 100%; }
.tableWidth1024 { width: 1024px; min-width: 600px; }
.tableFont { font-size: 10pt; }
.date { font-size: 9pt; font-style: italic; color: grey;  }
.textColor1 { color: white; }
.textColor4 { color: #7e5353; }
.backgroundColor1 { background-color: rgb(0, 86, 162); }
.backgroundColor2 { background-color: rgb(48, 119, 187); }
.backgroundColor3 { background-color: rgb(51, 177, 237); }
.backgroundColor4 { background-color: #00e0ff; }
.border4 { border: 2px solid #00e0ff; }
.borderRadius { border-radius: 20px; }
.balanceInformer { text-align: right; padding: 10px 20px; }
.commentFont { font-size: x-small; }
.textFont { font-size: 10pt; }
.autopaymentSum { text-align: right; }
.borderRadiusShadow3 { border: 1px solid #808080; border-radius: 3px; box-shadow: 3px 3px 3px #a0a0a0; }
.borderRadiusShadow5 { border: 1px solid #808080; border-radius: 5px; box-shadow: 3px 3px 5px #a0a0a0; }
.helpMessage { text-align: center; font-style: italic; font-size: 0.9rem; margin: 10px 10px; }
.infoText { text-align: center; font-style: italic; font-size: 1rem; }
.notFound { text-align: center; font-style: italic; font-size: 0.9rem; color: #888; }

.dashboardPaths { padding: 10px 10px; margin: 0px auto; }

#dashboardRoot { padding-bottom: 60px; }
ul.dashboard { display: grid; grid-column-gap: 10px; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr) ); padding-left: 0px; margin: 0px auto; }
ul.dashboard li.tile { min-height: 8em; cursor: pointer; border: 1px solid #f0f0f0; border-radius: 5px; box-shadow: 3px 3px 5px #aaa; margin: 2%; margin-top: 6px; list-style-type: none; background-color: var(--tile-background-color); }
ul.dashboard li.tile .header { vertical-align: middle; font-size: 1.5rem; color: var(--color0); padding: 5px 10px; text-align: left; background-color: var(--color4); border-radius: 4px 4px 0px 0px; }
ul.dashboard li.tile .body { font-size: 0.95rem; color: var(--color7); padding: 10px; }
ul.dashboard li.tile img { opacity: 0.3; height: 5rem; color: var(--color5); }
ul.dashboard li.tileHeight { height: 9rem; }

.dateFontSize { font-size: 10pt; }
.dateAlign { text-align: left; margin: 10px; }

.titleFont, .titleFont1 { font-size: 10pt; font-weight: bold; }
.titleFont2 { font-size: 13pt; font-weight: bold; }
.titleFont3 { font-size: 1.5rem; font-weight: bold; }
.titleAlign { text-align: left; margin: 10px; } 
.titleColor { color: #444; }
.titleInset { margin: 10px 10px 10px 10px; }
.titleBottomLine { border-bottom: 2px solid var(--line-color); }
.titleBottomLine2 { border-bottom: 0.5px solid var(--line-color); }

.itemBlock { font-size: 1rem; padding-top: 10px; }
.itemBlockParams { margin-left: 10px; margin-top: 10px; line-height: 1.5rem; justify-content: flex-start; flex-wrap: wrap; }
.sum3 { font-size: 1.5rem; font-weight: bold; text-align: right; white-space: nowrap; }

.textFont, .textFont1 { font-size: 10pt; }  
.textFont2 { font-size: 13pt; }
.textIndent1 { text-indent: 2em; }
.textMarginTop1 { margin-top: 1em; }

.paramFont { font-size: 0.9rem; }
.paramColor { color: #999; }
.paramColor span { color: #444; }
.paramInset { margin: 0px 10px 0px 20px; }
.paramComment { font-style: italic; }

textarea.messageText { width: 100%; font-size: 1rem; resize: vertical; box-sizing: border-box; }

div.monthPeriod { display: flex; flex-direction: row; align-items: center; font-size: 0.9rem; margin-top: 10px; }
div.monthPeriod .monthPeriodButton { cursor: pointer; border: 1px solid #866; padding: 3px 5px; margin: 0px 5px; border-radius: 3px; min-width: 7rem; text-align: center; }
div.monthPeriod .monthPeriodSelect { background-color: #8cc; }

div.paymentMethod { border: 2px solid #ddd; border-radius: 5px; margin: 1rem 1rem; cursor: pointer; width: 10rem; height: 5rem; }
div.paymentMethod:hover { border: 2px solid #00f; }

.ap-button { border: 2px solid #ddd; border-radius: 5px; margin: 1rem 1rem; cursor: pointer; width: 10rem; height: 5rem; }
.ap-button .ap-period { font-size: 75%; white-space: nowrap; }
.ap-button:hover { border: 2px solid #00f; }

div.paramFlex div { display: flex; flex-direction: row; justify-content: flex-start; color: #222; font-weight: bold; line-height: 1.5rem }
div.paramFlex div span { width: 8rem; text-align: left; color: #888; font-weight: normal; }

.icon1 { height: 24px; }
.icon2 { height: 32px; }

.cursorPointer { cursor: pointer; }

.line { height: 1px; background-color: #ccc; margin-top: 5px; }
.line2 { height: 3px; border-top: 1px dashed #ccc; }
.headerRow { padding: 5px 10px; background-color: #eee; border-radius: 5px; align-items: center; }

.button1 { appearance: none; box-shadow: 5px 5px 3px #888; font-size: 13pt; background-color: rgb(246, 245, 244); border-radius: 5px; padding: 3px 10px; }
.backButton { appearance: none; box-shadow: 5px 5px 3px #888; font-size: 0.9rem; background-color: #fff; border-radius: 5px; padding: 3px 10px; }
.buttonWidth1 { width: 200px; margin: 0px 10px; }
.select1 { appearance: none; box-shadow: 5px 5px 3px #888; font-size: 13pt; background-color: #fff; border-radius: 5px; padding: 3px 10px; }
.select2 { appearance: none; box-shadow: 5px 5px 3px #888; font-size: 15pt; background-color: #fff; border-radius: 5px; padding: 3px 10px; }
.newTariffButton { background-color: #fff; }

.activatePanel { padding: 10px; margin: 10px; cursor: pointer; border: 1px solid #888; background-color: var(--button-panel-background-color); font-size: 0.9rem; }

.pageRoot { padding-bottom: 60px; }

.noteComment textarea { border: none; box-sizing: border-box; margin-bottom: 10px; width: 100%; height: 400px; padding: 10px; }
.contractPassword { display: flex; flex-direction: row; align-items: flex-start; }
.contractPassword > div { width: 40%; }  
.contractLimit { display: flex; flex-direction: row; align-items: flex-start; }
.contractLimit > div { width: 44%; }  
.tile4480 { display: flex; flex-direction: row; align-items: flex-start; flex-wrap: wrap; }
.tile4480 > div { width: 44%; }  
.column2 { display: flex; flex-direction: row; align-items: flex-start; }
.column2 > div { width: 44%; }

.bgToolBarButtons div { display: inline-block; cursor: pointer; }
.bgToolBarButtons div img { vertical-align: middle; }

.bgMenu { position: relative; }
.bgMenu ul { display: none; list-style-type: none; border: 1px solid #000; padding: 10px 0px; margin: 0px; background-color: #fff; border-radius: 10px; }
.bgMenu ul li { white-space: nowrap; padding: 3px 20px; cursor: pointer; }
.bgMenu ul li a { display: block; font-size: 1rem; }
.bgMenu ul li:hover { background-color: #eee; }
.bgMenu:hover ul { display: block; position: absolute; top: 31px; z-index: 10; } 
	
.bgPopupPanel { position: relative; }
.bgPopupPanel div { display: none; border: 1px solid #000; padding: 10px; background-color: #fff; border-radius: 10px; font-size: 1.0em; color: #888; line-height: 1.3em; }
.bgPopupPanel div span.n { display: inline-block; width: 8em; color: #444; }
.bgPopupPanel div span.v { display: inline-block; width: 10em; }
.bgPopupPanel:hover div { display: block; position: absolute; top: 32px; z-index: 10; } 

div.tile { max-width: 100%; border: 1px solid #ddd; border-radius: 10px; margin: 10px auto; background-color: #fff; padding: 10px; }
div.flexColumn { display: flex; flex-direction: column; }
div.flexRow { display: flex; flex-direction: row; justify-content: space-between; }
div.gridRow { display: grid; grid-template-columns: auto 6em; box-sizing: content-box; }

.formText { font-size: 0.9rem; }
.formText span { display: inline-block; margin: 10px 0px 3px 10px; color: #999; }
.formText input[type=text] { width: 100%; padding: 5px; font-size: 1.2rem; text-align: center; border: none; border: 1px solid #999; border-radius: 8px; }

div.password { font-size: 0.9rem; }
div.password span { display: inline-block; margin: 10px 0px 3px 10px; color: #999; }
div.password input[type=password] { width: 100%; padding: 5px; font-size: 1.2rem; text-align: center; border: none; border: 1px solid #999; border-radius: 8px; box-sizing: border-box; }

div.textFieldLabel { font-size: 1.2rem; margin-bottom: 0.2rem; margin-left: 1rem; }
div.textField input[type=text] { width: 100%; padding: 5px; font-size: 1.3rem; border: 1px solid #999; border-radius: 8px; box-sizing: border-box; }
div.textField input[type=password] { width: 100%; padding: 5px; font-size: 1.3rem; border: 1px solid #999; border-radius: 8px; box-sizing: border-box; }
div.textField select { width: 100%; padding: 5px; font-size: 1.3rem; border: 1px solid #999; border-radius: 8px; box-sizing: border-box; }
div.formButtons { display: flex; flex-direction: row; justify-content: flex-end; margin-top: 1rem; }
div.formButtons button { font-size: 1.3rem; margin: 10px 0px 10px 10px; padding: 5px 15px; }
div.addAttach { width: 5rem; height: 5rem; border: 1px solid #444; border-radius: 10px; font-size: 4rem; display: flex; justify-content: center; align-items: center; cursor: pointer; background: radial-gradient(circle, skyblue, steelblue); }
.mTop03 { margin-top: 0.3rem; }
.mTop05 { margin-top: 0.5rem; }
.mTop10 { margin-top: 1.0rem; }
.mTop20 { margin-top: 2.0rem; }
.mTop30 { margin-top: 3.0rem; }

img.iconButton { height: 2rem; cursor: pointer; margin: 0px 5px; }
img.iconCloseButton, img.iconCopyButton { height: 1.8rem; cursor: pointer; margin: 0px; padding: 0px; }

.inputText { margin-top: 1em; text-indent: 10px; }

.paramDate { font-size: 3rem; }
.paramDate div { padding: 0rem 0.5rem; }
.paramDate div { border-width: 1px; border-style: solid; border-radius: 10px 10px 10px 10px; }
.paramDate div input { font-size: 3rem; text-align: center; padding: 0rem; border: none; margin: 0px; box-sizing: border-box; }
.paramDatePoint { border: none; }

div.tileTabs { margin-top: 0px; margin-bottom: 1rem; }		

div.textIndent { text-indent: 2em; }
div.text { text-align: justify; font-size: 1em; }
div.text1 { text-align: justify; font-size: 1.1em; }
div.text2 { text-align: justify; font-size: 1.2em; }

div.subTitle { text-align: left; font-size: 1em; font-weight: bold; }
div.subTitle1 { text-align: left; font-size: 1.1em; font-weight: bold; }

div.borderShadow { border: 1px solid #555; border-radius: 5px; box-shadow: 3px 3px 5px #999; margin: 10px 20px; padding: 20px; float: left; }

.bgmodal {
	position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: 99; opacity: 1; background: rgba(0,0,0,0.5);
	overflow: hidden; overflow-y: auto; 
	display: flex; flex-flow: column nowrap; justify-content: center; align-items: center;
}
.bgmodal_dialog { width: auto; position: relative; margin: 0px auto; }
.bgmodal-content { 
	position: relative; display: flex; flex-direction: column; width: 400px; 
	background-color: #fff; background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2); border-radius: .5rem; outline: 0;
}
.bgmodal-header { display: flex; align-items: center; justify-content: space-between; padding: 15px; border-bottom: 1px solid #eceeef; }
.bgmodal-title { margin-top: 0; margin-bottom: 0; line-height: 1.5; font-size: 1.25rem; font-weight: 500; }
.bgmodal-close { float: right; font-family: sans-serif; font-size: 24px; font-weight: 700; line-height: 1; color: #000; text-shadow: 0 1px 0 #fff; opacity: .5; text-decoration: none; }
.bgmodal-close:focus, .bgmodal-close:hover { color: #000; text-decoration: none; cursor: pointer; opacity: 0.75; } 
.bgmodal-body { position: relative; flex: 1 1 auto; padding: 15px; overflow: auto; }

html, body { 
	height: 100%;
	min-height: 100%; 
	background-color: var(--color6);
	margin: 0; 
	padding: 0; 
}

a { color: #0056a2; text-decoration: none; }
a:hover { color: #269AF0; text-decoration: none; } 
a:visited { color: #0056a2; text-decoration: none; }
	
/* разметка страницы */
.contracts a,.menu a {
	color: #dfebf6;
	font-size: 10pt;
	text-decoration: none;
}
.contracts a:hover,.menu a:hover{color: #ffffff; text-decoration: none;}
.contracts a:visited,.menu a:visited{color: #dfebf6; text-decoration: none;}

.marginTopButtons { margin-top: 20px; }

#all {
	position: relative;
	min-height: calc( 100% - 10rem);
	background-color: var(--color6);
	width: 40vw;
	min-width: 800px;
	margin-left: auto;
	margin-right: auto;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
	
div.pageTitle {
	border-radius: 5px;
	padding: 5px 15px;
	font-size: 18pt;
	font-weight: bold;
	text-align: left;
	color: var(--color0);	
	background-color: var(--color4);
	margin: 0px;
	margin-bottom: 15px;
}

div.contracts {
	background-color: #0056a2;
	padding: 10px 30px;
	font-size: 12px;
	color: #FFFFFF;
	margin-bottom: -1px;
}

@media screen and (max-width: 479px) {
	div.contracts { max-width: 100vw; }
	div.pageHeader { max-width: 100vw; height: 6rem; }
	div.pageHeader > .content { display: grid; gap: 0.2rem; grid-template-columns: 120px auto; grid-template-rows: 1fr 1fr; grid-template-areas: "logo buttons" "logo contract"; }
	div.pageHeader > .content div.logo { grid-area: logo; display: grid; align-items: center; }
	div.pageHeader > .content div.contract { grid-area: contract; }
	/* div.pageHeader > .content div.balance { grid-area: balance; } */
	div.pageHeader > .content div.buttons { grid-area: buttons; text-align: right; }
	#all {
		position: relative;  
		min-height: calc( 100% - 10rem);
		width: 100vw;
		max-width: 100vw;
		min-width: 100vw;
		margin-left: 0px;
		margin-right: 0px;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		background-color: #eee;
	}

	.dashboardPaths { max-width: 100vw; }
	ul.dashboard { max-width: 100vw; }
	ul.dashboard li.tileHeight { height: 9rem; }
	ul.dashboard li.tile { margin-left: 0px; margin-right: 0px; }

	.icon1 { height: 48px; }
	.icon2 { height: 48px; }
	.buttonWidth1 { width: 90%; margin: 10px 0px; padding: 10px; }
	.billDoc span, .invoiceDoc span { display: block; } 
	.textFont, .textFont1 { font-size: 12pt; }
	.contractPassword { display: flex; flex-direction: column; align-items: flex-start; }
	.contractPassword > div { width: 80%; }  
	.contractLimit { display: flex; flex-direction: column; align-items: flex-start; }
	.contractLimit > div { width: 80%; }  
	.contractLimit { display: flex; flex-direction: column; align-items: flex-start; }
	.contractLimit > div { width: 80%; }  
	.tile4480 { display: flex; flex-direction: column; align-items: flex-start; }
	.tile4480 > div { width: 80%; }  
	.column2 { display: flex; flex-direction: column; align-items: flex-start; }
	.column2 > div { width: 90%; } 
	.bgmodal-content { width: 350px; } 
}	

div.contracts span {
	font-weight: bold;
}
div.contracts ul {
	padding-left: 0px;
	padding-right: 10px;
	display: inline;
}
div.contracts li {
	padding-left: 10px;
	padding-right: 10px;
	display: inline;
	background: url(img/peregorodki.gif) no-repeat;
}
div.menu {
	font-size: 12px;
	color: #FFFFFF;
	background-color: #0056a2;
	width: 210px;
	margin-top: 15px;
	float: left;
}
div.menu p {
	font-weight: bold;
	padding-left: 20px;
	margin-top: 10px;
}
div.menu ul {
	margin-left: 0px;
	padding-left: 20px;
	background-color: #5391CE;
	border-top-color: white;
	border-top-style: solid;
	border-top-width: 2px;
	border-bottom-color: white;
	border-bottom-style: solid;
}
div.menu li {
	list-style-image: url(img/strelki.gif);
	background-color: #3077BB;
	border-bottom-color: white;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-left-color: white;
	border-left-style: solid;
	border-left-width: 1px;
	padding: 2px;
	padding-left: 10px;
}
div.popup_menu {
	background-color: #77ad5a;
	margin-bottom: 1em;
	border: 1px solid black;
	padding: 7px;
	background: white;
	font-size: 10pt;
	z-index: 10;
}
div.popup_menu p {
	margin: 5px 5px;
}
div.empty {
	clear: both;
}
div.footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	min-width: 100%;
	height: 40px;
	font-size: 12px;
	color: #aaa;
	background-color: #fff;
	border-top-style: solid;
	border-top-color: #ffffff;
	border-top-width: 1px;
	text-align: right;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border: 1px solid #ddd;
}
div.footer p { color: #aaa; padding: 2px 10px; }
div.footer p a { color: #aaa; }

/* конец разметки страницы */

/* служебные страницы с ошибками авторизации, всплывающие окошки с ошибками */
body.popuphelp
{
	margin: 10px;
}
/* заголовки 1/2 уровня на служебных страницах, всплывающих окошках */
h1.titlePage, h2.titlePage
{
	text-align: center;
}
/*некий блочный элемент ссылки закрытия попап-окна*/
.popupClose
{
	text-align: center;	
}

div.descrMessage {
	text-align: left;
	font-size: 1rem;
	color: var(--text-color);
	padding: 10px 30px;
}

font.info
{
	color: gray;
	font-size: 10px;
}

/*любые комментарии к таблицам/заполняемым формам*/
div.comment, em.comment
{
	font-size: small;
	vertical-align: text-top;
	color: #888;
}

/* формы */
form { margin: 0px;	padding: 0px; }

.multiselect {
	width: 150px;
}

/* таблица используемая в формах для компоновки контролов в фильтрах перед таблицей,
   есть отступ снизу */
table.filter {
	margin-bottom: 10px;
	background-color: #ffffff;
	border-collapse: collapse;
	border-spacing: 0px;
	padding: 0px;
	margin: 0px;
}
	
table.filter table {
	border-spacing: 0px;
	padding: 0px;
	margin: -1px;
}

table.filter div {
	margin-top: 0px;
	margin-bottom: 2px;
}

/*блок контента страницы. этим id помечен <td>*/
.content, .empty {
	color: #000000;
	padding-right: 5px;
	padding-left: 5px;
	font-size: 12pt;
	min-height: 80%;
}

/*таблица для расположения кнопок листания страниц (в основном чтобы в @print убрать картинки)*/
/*возможно, стоит сделать единый стиль для неотображаемых при печати элементов из content*/
.content table.tablePagesBar td,
.content table.tablePagesBar th {
	font-size: 10px;
	color: #000000;
	background-color: #FFFFFF;
	font-weight: normal;
	white-space: nowrap;
	padding: 0px;
	margin: 0px;
}
	
.content table.tablePagesBar th {
	font-weight: bold;
}

/*таблицы с данными*/
table.table800,
table.table
{
	min-width: 400px;
	background-color: #0056a2;
	text-align: center;
	border-spacing: 1px;	
	border-collapse: collapse; /* это+ border для td дублирует border-spacing: 1px; которого как всегда нету в IE*/
}

table.table800
{
	width:100%;
	width:700px;
}
	
table.table800 tbody tr td,
table.table800 tbody tr th,
table.table800 tfoot tr td,
table.table800 thead tr td,
table.table800 thead tr th,
table.table tbody tr td,
table.table tbody tr th,
table.table tfoot tr td,
table.table thead tr td,
table.table thead tr th
{
	padding: 5px;
	text-align: center;
	border: 1px solid #0056a2;
}
	
table.table800 tbody tr td,
table.table800 tfoot tr td,
table.table tbody tr td,
table.table tfoot tr td
{
	background-color: #ffffff;
}
	
table.table800 thead tr td,
table.table800 thead tr th,
table.table800 tbody tr th,
table.table thead tr td,
table.table thead tr th,
table.table tbody tr th
{
	background-color: #3077bb;
	color: #FFFFFF;
}	
	
table.table800 tfoot tr td,
table.table tfoot tr td {
	font-weight: bold;
}

/*пароль белым текстом на белом фоне, чтобы был виден только при выделении*/ 
td.password {
	color: #FFFFFF ! important;
}

td.alignRightAndPadding { text-align: right; padding-right: 10px; }
	
/*некие раскраски срок таблицы (в процессе, выполнено, выполнено с ошибкой)*/
tr.row_status_process td{
	background-color: #E8E8E8 ! important;
}
tr.row_status_ok td{
	background-color: #E8FFE8 ! important;
}
tr.row_status_fail td{
	background-color: #FFE8E8 ! important;
}
/*неактивная строка (серый шрифт)*/
tr.row_status_inactive td{
	color: #8e8e8e ! important;	
}

/*span в виде ссылки (для кнопок-ссылок итд)*/
span.spanaslink{
	border-bottom: 1px dashed #333333;
	cursor: pointer;
}

span.nowrap {
	white-space: nowrap;
}
	
/*таблица для расположения форм ввода многоярусных с кнопкой в нижнем ряду*/
table.layout {
	border-collapse: collapse;
}
table.layout tr td {
	text-align: left;
	padding: 2px;
	margin:  0px;
}
table.layout tr.foot td {
	text-align: right;
}

/* .ui-widget-header { background: none; border: 0px; } */
.ui-widget-content { border: 0px; }

div.paymentSumBlock {
	padding: 0px 4px; 
	display: table;
	width: 100%;
}

div.paymentSumBlock div { display: table-row; }
div.paymentSumBlock div div { display: table-cell; }

.show { display: block; }
.hide { display: none; }

.paramEditorButtonSelected { background-color: rgb(51, 177, 237); }

}

/* стили, применяемые при печати, необходима проверка! */
@media print {
	#idTdLeftPanel, 
	table.button, 
	#idTdSubContracts {
		display: none ! important;
	}
	table.filter {
		padding-bottom: 25px;
	}
	.content td {
		padding: 5px;
	}
	a {
		text-decoration: none;
		color: #000000;
	}
	td.line div {
		border-top-style: none ! important;
	}
	.header {
		border-bottom-color: #000000;
		margin-bottom: 10pt;
	}
	.header tr td {
		padding-left: 0px;
		color: #000000 ! important;
		background-color: #FFFFFF ! important;
	}
	.header th div {
		background:none ! important;
		height: auto ! important;
		width: 0px;
	}
	#idTableHeader.header {
		margin-bottom: 0px ! important;
	}
	#idTdLogo {
		padding-top: 0px ! important;
		padding-left: 10px ! important;
	}
	#idTdSubContractsLine div {
		height: 0px;
	}
	.content {
		padding-right: 0px;
		color: #000000;
		padding-left: 0px;
	}
	table.tablePagesBar img {
		display: none ! important;	
	}
	.comment {
		font-size: 8pt !important;
	}
	#idTdFooter {
		height: auto ! important;
	}
	#idTdFooterMargin {
		height: 0px ! important;
	}
	.content div div.report table thead tr td, 
	.content div div.report table tbody tr th,
	.content div div.report table tbody tr td {
		padding: 1px;
		font-size: 10pt;
	}
}

/* Cookie consent */
.cookie-consent-container {
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.3);
    border-radius: 8px 8px 0 0;
    transform: translateY(100%);
    opacity: 0;
    transition: transform 0.4s ease-out, opacity 0.4s ease-out;
}

.cookie-consent-container.show {
    transform: translateY(0);
    opacity: 1;
}

.cookie-content-wrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 15px;
}

.cookie-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    margin-left: 20px;
    margin-right: 20px;
}

.cookie-text {
    flex: 1;
    padding-right: 30px;
}

@media (max-width: 768px) {
    .cookie-content {
        flex-direction: column;
        text-align: center;
    }

    .cookie-text {
        padding-right: 0;
        margin-bottom: 15px;
        text-align: left;
        width: 100%;
    }
}
