From 73e1ca90287aaa7700c11f88d0fc5f6c257e9705 Mon Sep 17 00:00:00 2001
From: merelendor <merelendor@gmail.com>
Date: Sat, 27 Aug 2022 02:07:10 +0300
Subject: [PATCH] fixes for account, manager account layout

---
 pages/components/Footer/index.js              |   4 -
 pages/components/Layout/Account/index.js      |  27 +
 pages/contract/agreement.js                   | 114 ++--
 pages/contract/change/index.js                | 214 ++++----
 .../PenaltiesCalculatorForm/index.js          |   6 +-
 pages/contract/documents.js                   | 337 ++++++------
 pages/contract/events.js                      | 120 ++--
 pages/contract/fines.js                       | 337 +++---------
 pages/contract/index.js                       | 302 +++++-----
 pages/contract/materials.js                   |  72 ++-
 pages/contract/services.js                    | 516 +++++++++---------
 pages/documents/calendar.js                   | 158 +++---
 pages/documents/finals.js                     |  96 ++--
 pages/documents/reconciliations.js            | 128 +++--
 pages/events.js                               | 199 ++++---
 pages/index.js                                | 243 ++++-----
 pages/settings/admin.js                       | 192 ++++---
 pages/settings/password.js                    |  96 ++--
 pages/settings/phone.js                       | 142 +++--
 pages/support/appeals.js                      | 214 ++++----
 pages/support/index.js                        | 182 +++---
 pages/support/request.js                      | 138 +++--
 22 files changed, 1796 insertions(+), 2041 deletions(-)
 create mode 100644 pages/components/Layout/Account/index.js

diff --git a/pages/components/Footer/index.js b/pages/components/Footer/index.js
index ad31b91..6da03cc 100644
--- a/pages/components/Footer/index.js
+++ b/pages/components/Footer/index.js
@@ -22,13 +22,9 @@ export default class Footer extends React.Component
 	render()
 	{
 		const { programs } = this.state;
-		const { authenticated } = this.props;
 
 		return (
 			<footer style={{ position: "relative" }}>
-				{ /* authenticated && (
-					<Manager style={{ position: "absolute", left: "60px", top: "-150px", minWidth: "730px", zIndex: 10, }} />
-				) */ }
 				<div className="container">
 					<ul className="column">
 						<li><b>Программы</b></li>
diff --git a/pages/components/Layout/Account/index.js b/pages/components/Layout/Account/index.js
new file mode 100644
index 0000000..4b4fdd5
--- /dev/null
+++ b/pages/components/Layout/Account/index.js
@@ -0,0 +1,27 @@
+import React from "react";
+import Manager from "../../Manager";
+
+export default class AccountLayout extends React.Component 
+{
+	constructor(props)
+	{
+		super(props);
+	}
+
+	render()
+	{
+		return (
+			<main>
+				<section>
+					<div className="clear"></div>
+					<div className="overflow">
+						<div className="container">
+							{ this.props.children }
+							<Manager/>
+						</div>
+					</div>
+				</section>
+			</main>
+		)
+	}
+}
\ No newline at end of file
diff --git a/pages/contract/agreement.js b/pages/contract/agreement.js
index 3532aab..52d85f7 100644
--- a/pages/contract/agreement.js
+++ b/pages/contract/agreement.js
@@ -20,6 +20,7 @@ import {
 	getContractRules,
 	getFile,
 } from "../../actions";
+import AccountLayout from "../components/Layout/Account";
 
 class ContractPage extends React.Component 
 {
@@ -137,66 +138,61 @@ class ContractPage extends React.Component
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
 				<Header { ...this.props } />
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ flexDirection: "column" }}>
-									<h1 className="section_title">Договор №{ number }</h1>
-									<h5 style={{ fontSize: "14px" }}>
-										{ date !== undefined && date !== null && date !== null && (<> от {moment(date).format("DD.MM.YYYY")}</>) }
-										{ car !== undefined && car !== null ? ` - ${car.brand.name} ${car.model.name} | ${ car.reg_number !== null ? car.reg_number : "без рег. номера" } | ${ car.vin_number !== null ? car.vin_number : "без VIN номера" }` : "" }
-									</h5>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu number={ number } { ...this.props } />
-								<article>
-									{ loading ? (
-										<div className="table_row table_header" style={ { minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center", } }>
-											<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-										</div>
-									) : (
-										<div className="dosc_list medium-icon">
-											{ unsigned !== undefined && unsigned !== null && unsigned.documents !== undefined && unsigned.documents !== null && unsigned.count > 0 && (
-												<>
-													<p className="list_title">К подписанию</p>
-													{ this._renderDocuments(unsigned.documents, "contracts") }
-													{ this._renderDocuments(unsigned.documents, "agreements") }
-													{ this._renderDocuments(unsigned.documents, "assignments") }
-													{ this._renderDocuments(unsigned.documents, "redemptions") }
-												</>
-											) }
-											{ signed !== undefined && signed !== null && signed.documents !== undefined && signed.documents !== null && signed.count > 0 && (
-												<>
-													<p className="list_title">Действующие</p>
-													{ this._renderDocuments(signed.documents, "contracts") }
-													{ this._renderDocuments(signed.documents, "agreements") }
-													{ this._renderDocuments(signed.documents, "assignments") }
-													{ this._renderDocuments(signed.documents, "redemptions") }
-												</>
-											) }
-											{ rules !== undefined && rules !== null && rules.map((document, index) => (
-												<div className="row" key={ index} >
-													<p className="doc_name i-pdf">
-														{ document.name }
-														<span style={{ width: "100%" }}>
-															Дата вступления в силу: { document.active_from }
-														</span>
-													</p>
-													<DownloadPdfButton url={ `${ process.env.NEXT_PUBLIC_MAIN_SITE }${ document.url }` } filename={ `${ document.filename }.pdf` } bitrix={ true } />
-												</div>
-											)) }
-										</div>
-									) }
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: "column" }}>
+							<h1 className="section_title">Договор №{ number }</h1>
+							<h5 style={{ fontSize: "14px" }}>
+								{ date !== undefined && date !== null && date !== null && (<> от {moment(date).format("DD.MM.YYYY")}</>) }
+								{ car !== undefined && car !== null ? ` - ${car.brand.name} ${car.model.name} | ${ car.reg_number !== null ? car.reg_number : "без рег. номера" } | ${ car.vin_number !== null ? car.vin_number : "без VIN номера" }` : "" }
+							</h5>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu number={ number } { ...this.props } />
+						<article>
+							{ loading ? (
+								<div className="table_row table_header" style={ { minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center", } }>
+									<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
+								</div>
+							) : (
+								<div className="dosc_list medium-icon">
+									{ unsigned !== undefined && unsigned !== null && unsigned.documents !== undefined && unsigned.documents !== null && unsigned.count > 0 && (
+										<>
+											<p className="list_title">К подписанию</p>
+											{ this._renderDocuments(unsigned.documents, "contracts") }
+											{ this._renderDocuments(unsigned.documents, "agreements") }
+											{ this._renderDocuments(unsigned.documents, "assignments") }
+											{ this._renderDocuments(unsigned.documents, "redemptions") }
+										</>
+									) }
+									{ signed !== undefined && signed !== null && signed.documents !== undefined && signed.documents !== null && signed.count > 0 && (
+										<>
+											<p className="list_title">Действующие</p>
+											{ this._renderDocuments(signed.documents, "contracts") }
+											{ this._renderDocuments(signed.documents, "agreements") }
+											{ this._renderDocuments(signed.documents, "assignments") }
+											{ this._renderDocuments(signed.documents, "redemptions") }
+										</>
+									) }
+									{ rules !== undefined && rules !== null && rules.map((document, index) => (
+										<div className="row" key={ index} >
+											<p className="doc_name i-pdf">
+												{ document.name }
+												<span style={{ width: "100%" }}>
+													Дата вступления в силу: { document.active_from }
+												</span>
+											</p>
+											<DownloadPdfButton url={ `${ process.env.NEXT_PUBLIC_MAIN_SITE }${ document.url }` } filename={ `${ document.filename }.pdf` } bitrix={ true } />
+										</div>
+									)) }
+								</div>
+							) }
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/contract/change/index.js b/pages/contract/change/index.js
index 25f32ed..849d9c5 100644
--- a/pages/contract/change/index.js
+++ b/pages/contract/change/index.js
@@ -33,6 +33,7 @@ import {
 } from "../../../actions";
 import Options from "./components/Options";
 import Comparison from "./components/Comparison";
+import AccountLayout from "../../components/Layout/Account";
 
 class ChangeGraphicPage extends React.Component 
 {
@@ -280,123 +281,118 @@ class ChangeGraphicPage extends React.Component
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
 				<Header { ...this.props } />
-				<main style={{ display: "flex", flexDirection: "column", flex: 1 }}>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ flexDirection: "column" }}>
-									<h1 className="section_title">Договор №{ number }</h1>
-									<h5 style={{ fontSize: "14px" }}>
-										{ date !== undefined && date !== null && date !== null && ( <> от {moment(date).format("DD.MM.YYYY")}</> ) }
-										{ car !== undefined && car !== null ? ` - ${car.brand.name} ${car.model.name} | ${ car.reg_number !== null ? car.reg_number : "без рег. номера" } | ${ car.vin_number !== null ? car.vin_number : "без VIN номера" }` : "" }
-									</h5>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: "column" }}>
+							<h1 className="section_title">Договор №{ number }</h1>
+							<h5 style={{ fontSize: "14px" }}>
+								{ date !== undefined && date !== null && date !== null && ( <> от {moment(date).format("DD.MM.YYYY")}</> ) }
+								{ car !== undefined && car !== null ? ` - ${car.brand.name} ${car.model.name} | ${ car.reg_number !== null ? car.reg_number : "без рег. номера" } | ${ car.vin_number !== null ? car.vin_number : "без VIN номера" }` : "" }
+							</h5>
+						</div>
+						<Company { ...this.props }/>
+					</div>
+					{ loading ? (
+						<div className="aside_container about">
+							<InnerMenu number={ number } { ...this.props } />
+							<article className="changes">
+								<div className="container" style={{ display: "flex", alignItems: "center", justifyContent: "center", }}>
+									<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
 								</div>
-								<Company { ...this.props }/>
-							</div>
-							{ loading ? (
-								<div className="aside_container about">
-									<InnerMenu number={ number } { ...this.props } />
-									<article className="changes">
-										<div className="container" style={{ display: "flex", alignItems: "center", justifyContent: "center", }}>
-											<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-										</div>
-									</article>
-								</div>
-							) : (
+							</article>
+						</div>
+					) : (
+						<>
+							{ mode_comparison || mode_calculation || mode_final ? (
 								<>
-									{ mode_comparison || mode_calculation || mode_final ? (
-										<>
-											{ mode_final ? (
-												<div className="aside_container about">
-													<FinalMessage number={ number } comment={ comment }/>
-												</div>
-											) : (
-												<div className="aside_container about">
-													<Comparison 
-														signer={ signer } 
-														signatories={ signatories } 
-														calculations={ calculations } 
-														calculation_id={ calculation_id } 
-														editable={ editable } 
-														current={ current } 
-														calculated={ calculated } 
-														onBack={ this._handle_onBack } 
-														onOptions={ this._handle_onOptions } 
-														onSigner={ this._handle_onSigner } 
-														onSign={ this._handle_onSign } 
-													/>
-												</div>
-											) }
-										</>
+									{ mode_final ? (
+										<div className="aside_container about">
+											<FinalMessage number={ number } comment={ comment }/>
+										</div>
 									) : (
 										<div className="aside_container about">
-											<InnerMenu number={ number } { ...this.props } />
-											<article className="changes">
-												{ mode_options ? (
-													<Options 
-														dispatch={ this.props.dispatch } 
-														number={ number } 
-														variants={ variants } 
-														variants_selected={ variants_selected } 
-														options={ options } 
-														onVariants={ this._handle_onVariants } 
-														onCalculate={ this._handle_onCalculate } 
-													/>
-												) : (
-													<>
-														{ variants !== null && (
-															<>
-																{ variants.enable_addcontract === false ? (
-																	<div className="block alert">
-																		<p>
-																			Внимание! Существует активное неподписанное дополнительное
-																			соглашение. Расчёт новых изменений невозможен
-																		</p>
-																		<Link href={`/contract/${ number }/agreement`}><a>Подробнее</a></Link>
-																	</div>
-																) : (
-																	<></>
-																) }
-																{ calculations !== undefined && calculations !== null && calculations.length > 0 && (
-																	<div className="block">
-																		<p className="title">Предварительные расчеты</p>
-																		<CalculationsList number={ number } calculations={ calculations } onCalculation={ this._handle_onCalculation }/>
-																	</div>
-																) }
-																<div className="block">
-																	<p className="title">
-																		Подписанты
-																		<Link href=""><a>Добавить подписанта</a></Link>
-																	</p>
-																	<SignatoriesList signatories={ signatories }/>
-																</div>
-																<VariantsList 
-																	onOptions={ this._handle_onOptions } 
-																	onVariant={ this._handle_onVariantSelect } 
-																	variants={ variants } 
-																	variants_types={ variants_types } 
-																	selected={ variants_selected } 
-																	loading={ variants_loading } 
-																	blocked={ variants.enable_addcontract === false ? false : false } 
-																/>
-																{/*}
-																{ variants.enable_addcontract !== false && (
-																) }
-																{*/}
-															</>
-														) }
-													</>
-												) }
-											</article>
+											<Comparison 
+												signer={ signer } 
+												signatories={ signatories } 
+												calculations={ calculations } 
+												calculation_id={ calculation_id } 
+												editable={ editable } 
+												current={ current } 
+												calculated={ calculated } 
+												onBack={ this._handle_onBack } 
+												onOptions={ this._handle_onOptions } 
+												onSigner={ this._handle_onSigner } 
+												onSign={ this._handle_onSign } 
+											/>
 										</div>
 									) }
 								</>
+							) : (
+								<div className="aside_container about">
+									<InnerMenu number={ number } { ...this.props } />
+									<article className="changes">
+										{ mode_options ? (
+											<Options 
+												dispatch={ this.props.dispatch } 
+												number={ number } 
+												variants={ variants } 
+												variants_selected={ variants_selected } 
+												options={ options } 
+												onVariants={ this._handle_onVariants } 
+												onCalculate={ this._handle_onCalculate } 
+											/>
+										) : (
+											<>
+												{ variants !== null && (
+													<>
+														{ variants.enable_addcontract === false ? (
+															<div className="block alert">
+																<p>
+																	Внимание! Существует активное неподписанное дополнительное
+																	соглашение. Расчёт новых изменений невозможен
+																</p>
+																<Link href={`/contract/${ number }/agreement`}><a>Подробнее</a></Link>
+															</div>
+														) : (
+															<></>
+														) }
+														{ calculations !== undefined && calculations !== null && calculations.length > 0 && (
+															<div className="block">
+																<p className="title">Предварительные расчеты</p>
+																<CalculationsList number={ number } calculations={ calculations } onCalculation={ this._handle_onCalculation }/>
+															</div>
+														) }
+														<div className="block">
+															<p className="title">
+																Подписанты
+																<Link href=""><a>Добавить подписанта</a></Link>
+															</p>
+															<SignatoriesList signatories={ signatories }/>
+														</div>
+														<VariantsList 
+															onOptions={ this._handle_onOptions } 
+															onVariant={ this._handle_onVariantSelect } 
+															variants={ variants } 
+															variants_types={ variants_types } 
+															selected={ variants_selected } 
+															loading={ variants_loading } 
+															blocked={ variants.enable_addcontract === false ? false : false } 
+														/>
+														{/*}
+														{ variants.enable_addcontract !== false && (
+														) }
+														{*/}
+													</>
+												) }
+											</>
+										) }
+									</article>
+								</div>
 							) }
-						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						</>
+					) }
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/contract/components/PenaltiesCalculatorForm/index.js b/pages/contract/components/PenaltiesCalculatorForm/index.js
index 93455da..00577b9 100644
--- a/pages/contract/components/PenaltiesCalculatorForm/index.js
+++ b/pages/contract/components/PenaltiesCalculatorForm/index.js
@@ -72,10 +72,10 @@ export default class PenaltiesCalculatorForm extends React.Component
 		} = this.state;
 
 		return (
-			<div className="block-column">
+			<>
 				<div className="dropdown_block">
 					<div className="block_header">
-						<p>Счета-уведомления на пени</p>
+						<p>Расчёт планируемых пени</p>
 					</div>
 				</div>
 				<div className="block_with_form">
@@ -93,7 +93,7 @@ export default class PenaltiesCalculatorForm extends React.Component
 						<button className="button button-blue" disabled={ fines_calculation_disabled } onClick={ this._handle_onApply }>Применить</button>
 					</form>
 				</div>
-			</div>
+			</>
 		);
 	}
 }
\ No newline at end of file
diff --git a/pages/contract/documents.js b/pages/contract/documents.js
index a745ec5..9231a2b 100644
--- a/pages/contract/documents.js
+++ b/pages/contract/documents.js
@@ -29,6 +29,7 @@ import {
 	getReconciliationFile, 
 	getContractPenalties, 
 } from "../../actions";
+import AccountLayout from "../components/Layout/Account";
 
 const TYPES = {
 	upd: "УПД по очередным платежам",
@@ -60,6 +61,8 @@ class ContractDocumentsPage extends React.Component
 			penalties_date: moment().format("YYYY.MM.DD"), 
 			penalties_result: undefined, 
 		};
+
+		this.penalties_form_ref = React.createRef();
 	}
 
 	static getDerivedStateFromProps(nextProps, prevState) 
@@ -110,6 +113,24 @@ class ContractDocumentsPage extends React.Component
 				this.setState({ period_date_start: ds, valid_date_start: ds });
 			}
 		}
+
+		if (prevState.loading && this.state.loading)
+		{
+			if(document.location.hash.indexOf("penalties") > -1)
+			{
+				setTimeout(() => 
+				{
+					if(this.penalties_form_ref.current !== undefined && this.penalties_form_ref.current !== null)
+					{
+						console.log("this.penalties_form_ref.current", this.penalties_form_ref.current);
+						this.penalties_form_ref.current.scrollIntoView({
+							behavior: 'smooth', 
+							block: 'center', 
+						});
+					}
+				}, 100);
+			}
+		}
 	}
 
 	_handle_onReconciliationFileRequest = () => 
@@ -383,191 +404,185 @@ class ContractDocumentsPage extends React.Component
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
 				<Header { ...this.props }/>
-				{ penalties ? (
-					<main>
-						<section>
-							<div className="clear"></div>
-							<div className="container">
-								<div className="title_wrapper">
-									<div className="left" style={{ alignItems: "center", flexWrap: "wrap", alignItems: "flex-start" }}>
-										<button className="back" onClick={ this._handle_onPenaltiesHide }>Назад</button>
-										<div style={{ flexDirection: "column" }}>
-											<h1 className="section_title">Расчет планируемых пени</h1>
-											<h5 style={{ fontSize: "14px" }}>
-												Договор №{ number }
-												{ date !== undefined && date !== null && date !== null && (
-													<> от {moment(date).format("DD.MM.YYYY")}</>
-													) }
-												{ car !== undefined && car !== null
-												? ` - ${car.brand.name} ${car.model.name} | ${
-													car.reg_number !== null
-													? car.reg_number
-													: "без рег. номера"
-												} | ${
-													car.vin_number !== null
-													? car.vin_number
-													: "без VIN номера"
-												}`
-												: "" }
-											</h5>
-										</div>
-									</div>
-								</div>
-								<div className="aside_container about">
-									<article className="fine">
-										<div className="fine_block">
-											<div className="fine_col">
-												<p>
-													<span>Пени на дату</span>
-													{ moment(penalties_date, "YYYY.MM.DD").format("DD.MM.YYYY") }
-												</p>
-											</div>
-											{ penalties_result === undefined ? (
-												<div
-													style={{ minHeight: 200, display: "flex", justifyContent: "center", alignItems: "center", }}
-												>
-													<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-												</div>
-											) : (
-												<>
-													{ penalties_result.length > 0 ? (
-														<div className="fine_col">
-															{ penalties_result.map((bill, index) => (
-																<p key={ index }>
-																	{ moment(bill.dateBillout, "YYYY-MM-DD").format("MMMM") }
-																	<span>{ numeral(bill.sumBill).format(' ., ') }&nbsp;₽</span>
-																</p>															
-															)) }
-														</div>
-													) : (
-														<p>К сожалению на указанную дату расчет пени невозможен.</p>
-													) }
-												</>
-											)}
-										</div>
-									</article>
-								</div>
-							</div>
-						</section>
-					</main>
-				) : (
-					<main>
-						<section>
-							<div className="clear"></div>
-							<div className="container">
-								<div className="title_wrapper">
-									<div className="left" style={{ flexDirection: "column" }}>
-										<h1 className="section_title">Договор №{ number }</h1>
+				<AccountLayout>
+					{ penalties ? (
+						<>
+							<div className="title_wrapper">
+								<div className="left" style={{ alignItems: "center", flexWrap: "wrap", alignItems: "flex-start" }}>
+									<button className="back" onClick={ this._handle_onPenaltiesHide }>Назад</button>
+									<div style={{ flexDirection: "column" }}>
+										<h1 className="section_title">Расчет планируемых пени</h1>
 										<h5 style={{ fontSize: "14px" }}>
+											Договор №{ number }
 											{ date !== undefined && date !== null && date !== null && (
 												<> от {moment(date).format("DD.MM.YYYY")}</>
-											) }
+												) }
 											{ car !== undefined && car !== null
 											? ` - ${car.brand.name} ${car.model.name} | ${
 												car.reg_number !== null
-													? car.reg_number
-													: "без рег. номера"
-												} | ${
+												? car.reg_number
+												: "без рег. номера"
+											} | ${
 												car.vin_number !== null
-													? car.vin_number
-													: "без VIN номера"
-												}`
+												? car.vin_number
+												: "без VIN номера"
+											}`
 											: "" }
 										</h5>
 									</div>
-									<Company { ...this.props }/>
 								</div>
-								<div className="aside_container about">
-									<InnerMenu number={ number } { ...this.props }/>
-									<article>
-										{ loading ? (
+							</div>
+							<div className="aside_container about">
+								<article className="fine">
+									<div className="fine_block">
+										<div className="fine_col">
+											<p>
+												<span>Пени на дату</span>
+												{ moment(penalties_date, "YYYY.MM.DD").format("DD.MM.YYYY") }
+											</p>
+										</div>
+										{ penalties_result === undefined ? (
 											<div
-												className="table_row table_header"
-												style={{
-													minHeight: 300,
-													display: "flex",
-													justifyContent: "center",
-													alignItems: "center",
-												}}
+												style={{ minHeight: 200, display: "flex", justifyContent: "center", alignItems: "center", }}
 											>
-												<SpinnerCircular
-													size={90}
-													thickness={51}
-													speed={100}
-													color="rgba(28, 1, 169, 1)"
-													secondaryColor="rgba(236, 239, 244, 1)"
-												/>
+												<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
 											</div>
 										) : (
 											<>
-												<div className="reconciliation_form">
-													<p>Акт сверки</p>
-													<div className="form_group">
-														<div className="form_field">
-															<DateInput
-																placeholder="Дата начала периода"
-																value={period_date_start}
-																min={valid_date_start}
-																max={valid_date_end}
-																onChange={this._handle_onPeriodDate_start}
-															/>
-														</div>
-														<div className="form_field">
-															<DateInput
-																placeholder="Дата окончания периода"
-																value={period_date_end}
-																min={valid_date_start}
-																max={valid_date_end}
-																onChange={this._handle_onPeriodDate_end}
-															/>
-														</div>
+												{ penalties_result.length > 0 ? (
+													<div className="fine_col">
+														{ penalties_result.map((bill, index) => (
+															<p key={ index }>
+																{ moment(bill.dateBillout, "YYYY-MM-DD").format("MMMM") }
+																<span>{ numeral(bill.sumBill).format(' ., ') }&nbsp;₽</span>
+															</p>															
+														)) }
 													</div>
-													<div className="form_group">
-														<button
-															className="button button-blue"
-															disabled={reconciliation_disabled}
-															onClick={() => {
-																this._handle_onReconciliationFileRequest();
-															}}
-														>
-															<>
-																{reconciliation_requested ? (
-																	<SpinnerCircular size={ 24 } thickness={ 100 } speed={ 100 } color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)"/>
-																) : (
-																	"Скачать"
-																)}
-															</>
-														</button>
-														{/*<button className="button button-blue">Отправить в ЭДО</button>*/}
+												) : (
+													<p>К сожалению на указанную дату расчет пени невозможен.</p>
+												) }
+											</>
+										)}
+									</div>
+								</article>
+							</div>
+						</>
+					) : (
+						<>
+							<div className="title_wrapper">
+								<div className="left" style={{ flexDirection: "column" }}>
+									<h1 className="section_title">Договор №{ number }</h1>
+									<h5 style={{ fontSize: "14px" }}>
+										{ date !== undefined && date !== null && date !== null && (
+											<> от {moment(date).format("DD.MM.YYYY")}</>
+										) }
+										{ car !== undefined && car !== null
+										? ` - ${car.brand.name} ${car.model.name} | ${
+											car.reg_number !== null
+												? car.reg_number
+												: "без рег. номера"
+											} | ${
+											car.vin_number !== null
+												? car.vin_number
+												: "без VIN номера"
+											}`
+										: "" }
+									</h5>
+								</div>
+								<Company { ...this.props }/>
+							</div>
+							<div className="aside_container about">
+								<InnerMenu number={ number } { ...this.props }/>
+								<article>
+									{ loading ? (
+										<div
+											className="table_row table_header"
+											style={{
+												minHeight: 300,
+												display: "flex",
+												justifyContent: "center",
+												alignItems: "center",
+											}}
+										>
+											<SpinnerCircular
+												size={90}
+												thickness={51}
+												speed={100}
+												color="rgba(28, 1, 169, 1)"
+												secondaryColor="rgba(236, 239, 244, 1)"
+											/>
+										</div>
+									) : (
+										<>
+											<div className="reconciliation_form">
+												<p>Акт сверки</p>
+												<div className="form_group">
+													<div className="form_field">
+														<DateInput
+															placeholder="Дата начала периода"
+															value={period_date_start}
+															min={valid_date_start}
+															max={valid_date_end}
+															onChange={this._handle_onPeriodDate_start}
+														/>
+													</div>
+													<div className="form_field">
+														<DateInput
+															placeholder="Дата окончания периода"
+															value={period_date_end}
+															min={valid_date_start}
+															max={valid_date_end}
+															onChange={this._handle_onPeriodDate_end}
+														/>
 													</div>
 												</div>
-												<div className="dropdown_blocks_list">
-													{documents !== undefined && documents !== null ? (
+												<div className="form_group">
+													<button
+														className="button button-blue"
+														disabled={reconciliation_disabled}
+														onClick={() => {
+															this._handle_onReconciliationFileRequest();
+														}}
+													>
 														<>
-															{this._renderDocuments(documents.upd, "upd")}
-															{this._renderDocuments(
-																documents.upd_avans,
-																"upd_avans"
-															)}
-															{this._renderDocuments(
-																documents.billfines,
-																"billfines"
+															{reconciliation_requested ? (
+																<SpinnerCircular size={ 24 } thickness={ 100 } speed={ 100 } color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)"/>
+															) : (
+																"Скачать"
 															)}
 														</>
-													) : null}
-													{ documents !== undefined && documents !== null && documents.billfines !== undefined && documents.billfines !== null && documents.billfines.length > 0 && (
-														<PenaltiesCalculatorForm onPenalties={ this._handle_onPenaltiesShow }/>
-													) }
+													</button>
+													{/*<button className="button button-blue">Отправить в ЭДО</button>*/}
 												</div>
-											</>
-										) }
-									</article>
-								</div>
+											</div>
+											<div className="dropdown_blocks_list">
+												{documents !== undefined && documents !== null ? (
+													<>
+														{this._renderDocuments(documents.upd, "upd")}
+														{this._renderDocuments(
+															documents.upd_avans,
+															"upd_avans"
+														)}
+														{this._renderDocuments(
+															documents.billfines,
+															"billfines"
+														)}
+													</>
+												) : null}
+												{ documents !== undefined && documents !== null && documents.billfines !== undefined && documents.billfines !== null && documents.billfines.length > 0 && (
+													<div className="block-column" ref={ this.penalties_form_ref }>
+														<PenaltiesCalculatorForm onPenalties={ this._handle_onPenaltiesShow }/>
+													</div>
+												) }
+											</div>
+										</>
+									) }
+								</article>
 							</div>
-						</section>
-					</main>
-				) }
-				<Footer authenticated={ true }/>
+						</>
+					) }
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/contract/events.js b/pages/contract/events.js
index e653239..739a3ee 100644
--- a/pages/contract/events.js
+++ b/pages/contract/events.js
@@ -16,6 +16,7 @@ import InnerMenu from "./components/InnerMenu";
 import NotificationMessage from "../components/Events/NotificationMessage";
 
 import { getContractInfo, getFilteredEvents } from "../../actions";
+import AccountLayout from "../components/Layout/Account";
 
 class ContractPage extends React.Component 
 {
@@ -75,69 +76,64 @@ class ContractPage extends React.Component
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
 				<Header { ...this.props }/>
-					<main>
-						<section>
-							<div className="clear"></div>
-							<div className="container">
-								<div className="title_wrapper">
-									<div className="left" style={{ flexDirection: "column" }}>
-									<h1 className="section_title">Договор №{ number }</h1>
-									<h5 style={{ fontSize: "14px" }}>{ date !== undefined && date !== null && date !== null && (<> от { moment(date).format("DD.MM.YYYY") }</>)}{ car !== undefined && car !== null ? ` - ${ car.brand.name } ${ car.model.name } | ${ car.reg_number !== null ? car.reg_number : "без рег. номера" } | ${ car.vin_number !== null ? car.vin_number : "без VIN номера" }` : "" }</h5>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu number={ number } { ...this.props } />
-								<article>
-									{ filtered !== undefined ? (
-										<>
-										{ filtered.length > 0 ? (
-											<ul className="list events-list">
-												{ filtered.map((event, index) => (
-													<NotificationMessage event={ event } key={ index }/>
-												)) }
-											</ul>
-										) : (
-											<p>Нет событий по данному договору.</p>
-										) }
-										</>
-									) : (
-										<div className="container" style={{ display: "flex", alignItems: "center", justifyContent: "center", }}>
-											<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-										</div>
-									) }
-										{/*}
-										<li className="new">
-											<p className="name"><b>Внимание! Просрочена дата возврата СТС по договору: ХХ.ХХ.ХХХХ</b></p>
-											<p className="type">Важное</p>
-											<p className="date">10.01.2022</p>
-											<p className="action">
-												<a href="">Посмотрите порядок возврата СТС</a>&nbsp; или
-												&nbsp;<a href="">Загрузите скан СТС</a>
-											</p>
-										</li>
-										<li className="new">
-											<p className="name"><b>Внимание! Просрочена дата возврата СТС по договору: ХХ.ХХ.ХХХХ</b></p>
-											<p className="date">10.01.2022</p>
-											<p className="action">
-												<a href="">Посмотрите порядок возврата СТС</a>&nbsp; или
-												&nbsp;<a href="">Загрузите скан СТС</a>
-											</p>
-										</li>
-										<li className="new">
-											<p className="name">Внимание! Осталось ХХ дней до пролонгации КАСКО по договору №ХХХХ: ХХ.ХХ.ХХХХ. Не забудьте самостоятельно продлить полис ОСАГО</p>
-											<p className="date">10.01.2022</p>
-											<p className="action">
-												<a href="">Подробнее</a>
-											</p>
-										</li>
-										{*/}
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: "column" }}>
+							<h1 className="section_title">Договор №{ number }</h1>
+							<h5 style={{ fontSize: "14px" }}>{ date !== undefined && date !== null && date !== null && (<> от { moment(date).format("DD.MM.YYYY") }</>)}{ car !== undefined && car !== null ? ` - ${ car.brand.name } ${ car.model.name } | ${ car.reg_number !== null ? car.reg_number : "без рег. номера" } | ${ car.vin_number !== null ? car.vin_number : "без VIN номера" }` : "" }</h5>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu number={ number } { ...this.props } />
+						<article>
+							{ filtered !== undefined ? (
+								<>
+								{ filtered.length > 0 ? (
+									<ul className="list events-list">
+										{ filtered.map((event, index) => (
+											<NotificationMessage event={ event } key={ index }/>
+										)) }
+									</ul>
+								) : (
+									<p>Нет событий по данному договору.</p>
+								) }
+								</>
+							) : (
+								<div className="container" style={{ display: "flex", alignItems: "center", justifyContent: "center", }}>
+									<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
+								</div>
+							) }
+								{/*}
+								<li className="new">
+									<p className="name"><b>Внимание! Просрочена дата возврата СТС по договору: ХХ.ХХ.ХХХХ</b></p>
+									<p className="type">Важное</p>
+									<p className="date">10.01.2022</p>
+									<p className="action">
+										<a href="">Посмотрите порядок возврата СТС</a>&nbsp; или
+										&nbsp;<a href="">Загрузите скан СТС</a>
+									</p>
+								</li>
+								<li className="new">
+									<p className="name"><b>Внимание! Просрочена дата возврата СТС по договору: ХХ.ХХ.ХХХХ</b></p>
+									<p className="date">10.01.2022</p>
+									<p className="action">
+										<a href="">Посмотрите порядок возврата СТС</a>&nbsp; или
+										&nbsp;<a href="">Загрузите скан СТС</a>
+									</p>
+								</li>
+								<li className="new">
+									<p className="name">Внимание! Осталось ХХ дней до пролонгации КАСКО по договору №ХХХХ: ХХ.ХХ.ХХХХ. Не забудьте самостоятельно продлить полис ОСАГО</p>
+									<p className="date">10.01.2022</p>
+									<p className="action">
+										<a href="">Подробнее</a>
+									</p>
+								</li>
+								{*/}
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/contract/fines.js b/pages/contract/fines.js
index 92ec1eb..6af39ef 100644
--- a/pages/contract/fines.js
+++ b/pages/contract/fines.js
@@ -23,6 +23,7 @@ import {
   getContractDocuments,
   getReconciliationFile,
 } from "../../actions";
+import AccountLayout from "../components/Layout/Account";
 
 const TYPES = {
   upd: "УПД по очередным платежам",
@@ -81,7 +82,7 @@ class ContractDocumentsPage extends React.Component
 						number: this.props.number,
 					})
 					.then(() => {
-					this.setState({ loading: false });
+						this.setState({ loading: false });
 					})
 					.catch(() => {});
 				}
@@ -103,118 +104,6 @@ class ContractDocumentsPage extends React.Component
 		}
 	}
 
-	_handle_onReconciliationFileRequest = () => 
-	{
-		const { number } = this.props;
-		const { reconciliation_requested, period_date_start, period_date_end } = this.state;
-
-		if (!reconciliation_requested) 
-		{
-			this.setState({ reconciliation_requested: true }, () => 
-			{
-				const date_from = moment(period_date_start).format("YYYY-MM-DD");
-				const date_to = moment(period_date_end).format("YYYY-MM-DD");
-
-				getReconciliationFile({
-					contract: number,
-					date_from: date_from,
-					date_to: date_to,
-					filename: `${number}_reconciliation_${date_from}_${date_to}.pdf`,
-				})
-				.then(() => {
-					this.setState({ reconciliation_requested: false });
-				})
-				.catch(() => {
-					this.setState({ reconciliation_requested: false });
-				});
-			});
-		}
-	};
-
-	_handle_onPeriodDate_start = (date) => 
-	{
-		const {
-			valid_date_start,
-			valid_date_end,
-			period_date_start,
-			period_date_end,
-		} = this.state;
-		const md = moment(date, "DD.MM.YYYY");
-
-		if (md.isValid()) 
-		{
-			if (date >= valid_date_start && date <= valid_date_end) 
-			{
-				if (date < period_date_end) 
-				{
-					this.setState({
-						period_date_start: date,
-						reconciliation_disabled: false,
-					});
-				} 
-				else 
-				{
-					this.setState({
-						period_date_start: date,
-						reconciliation_disabled: true,
-					});
-				}
-			} 
-			else 
-			{
-				this.setState({
-				period_date_start: date,
-				reconciliation_disabled: true,
-				});
-			}
-		} 
-		else 
-		{
-			this.setState({ reconciliation_disabled: true });
-		}
-	};
-
-	_handle_onPeriodDate_end = (date) => 
-	{
-		console.log("_handle_onPeriodDate_end", "date", date);
-
-		const {
-			valid_date_start,
-			valid_date_end,
-			period_date_start,
-			period_date_end,
-		} = this.state;
-
-		if (moment(date).isValid()) 
-		{
-			if (date >= valid_date_start && date <= valid_date_end) 
-			{
-				if (date > period_date_start) 
-				{
-					this.setState({
-						period_date_end: date,
-						reconciliation_disabled: false,
-					});
-				} 
-				else 
-				{
-					this.setState({
-						period_date_end: date,
-						reconciliation_disabled: true,
-					});
-				}
-			} 
-			else 
-			{
-				this.setState({ period_date_end: date, reconciliation_disabled: true });
-			}
-		} 
-		else 
-		{
-			this.setState({ reconciliation_disabled: true });
-		}
-	};
-
 	_handle_onGroup = (group) => 
 	{
 		console.log("group", group);
@@ -230,100 +119,7 @@ class ContractDocumentsPage extends React.Component
 		}
 
 		this.setState({ opened: opened });
-	};
-
-	_renderDocuments = (documents, type) => 
-	{
-		const { number } = this.props;
-		const { opened } = this.state;
-
-		if (documents !== undefined && documents !== null) 
-		{
-			if (documents.length > 0) 
-			{
-				return (
-					<>
-						<div className="block-column">
-							<div
-								className={`dropdown_block ${ opened.indexOf(type) > -1 ? "open" : "" }`}
-							>
-								<div className="block_header default">
-									<p>{TYPES[type]}</p>
-								</div>
-							</div>
-							<div className="dosc_list medium-icon">
-								{ documents
-								.slice(0, opened.indexOf(type) > -1 ? documents.length : 3)
-								.map((doc, index) => 
-								{
-									console.log("doc", doc);
-
-									return (
-										<div className="row" key={index}>
-											<p 
-												className="doc_name i-pdf i-medium" 
-												data-format={ doc.extension } 
-											>
-												{doc.num} от {moment(doc.date).format("DD.MM.YYYY")}
-											</p>
-											<DownloadPrintFormPdfButton
-												className="download-icon"
-												filename={`${number}_${doc.type}_${doc.num}.${doc.extension}`}
-												contract={number}
-												num={doc.num}
-												date={doc.date}
-												type={doc.type}
-											/>
-										</div>
-									);
-								}) }
-								{ opened.indexOf(type) < 0 && documents.length > 3 && (
-									<div
-										className="row click-more"
-										onClick={ () => this._handle_onGroup(type) }
-									>
-										<p>
-											Еще {documents.length - 3}{" "}
-											{ pluralize(
-												documents.length - 3,
-												"документов",
-												"документ",
-												"документа",
-												"документов"
-											) }
-										</p>
-									</div>
-								) }
-						</div>
-						</div>
-					</>
-				);
-			}
-
-			if (type !== "upd_avans" && type !== "billfines") 
-			{
-				return (
-					<>
-						<div className="block-column">
-							<div
-								className={`dropdown_block ${ opened.indexOf(type) > -1 ? "open" : "" }`}
-							>
-								<div className="block_header">
-									<p>{ TYPES[ type ] }</p>
-								</div>
-							</div>
-							<div>
-								<p>Документов пока еще нет.</p>
-								<p>&nbsp;</p>
-							</div>
-						</div>
-					</>
-				);
-			}
-		}
-
-		return null;
-	};
+	}
 
 	_renderFines = (fines, type) => 
 	{
@@ -473,7 +269,7 @@ class ContractDocumentsPage extends React.Component
 				</div>
 			</>
 		);
-	};
+	}
 
 	render() 
 	{
@@ -506,72 +302,67 @@ class ContractDocumentsPage extends React.Component
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
 				<Header { ...this.props } />
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ flexDirection: "column" }}>
-									<h1 className="section_title">Договор №{number}</h1>
-									<h5 style={{ fontSize: "14px" }}>
-										{ date !== undefined && date !== null && date !== null && (
-											<> от {moment(date).format("DD.MM.YYYY")}</>
-										) }
-										{ car !== undefined && car !== null
-										? ` - ${car.brand.name} ${car.model.name} | ${
-											car.reg_number !== null
-												? car.reg_number
-												: "без рег. номера"
-											} | ${
-											car.vin_number !== null
-												? car.vin_number
-												: "без VIN номера"
-											}`
-										: "" }
-									</h5>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu number={ number } { ...this.props }/>
-								<article>
-									{ loading ? (
-										<div
-											className="table_row table_header"
-											style={{
-												minHeight: 300,
-												display: "flex",
-												justifyContent: "center",
-												alignItems: "center",
-											}}
-										>
-											<SpinnerCircular
-												size={90}
-												thickness={51}
-												speed={100}
-												color="rgba(28, 1, 169, 1)"
-												secondaryColor="rgba(236, 239, 244, 1)"
-											/>
-										</div>
-									) : (
-										<>
-											<div className="dropdown_blocks_list">
-												{documents !== undefined && documents !== null ? (
-													<>
-														{this._renderFines(documents.fines, "fines")}
-													</>
-												) : null}
-											</div>
-										</>
-									) }
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: "column" }}>
+							<h1 className="section_title">Договор №{number}</h1>
+							<h5 style={{ fontSize: "14px" }}>
+								{ date !== undefined && date !== null && date !== null && (
+									<> от {moment(date).format("DD.MM.YYYY")}</>
+								) }
+								{ car !== undefined && car !== null
+								? ` - ${car.brand.name} ${car.model.name} | ${
+									car.reg_number !== null
+										? car.reg_number
+										: "без рег. номера"
+									} | ${
+									car.vin_number !== null
+										? car.vin_number
+										: "без VIN номера"
+									}`
+								: "" }
+							</h5>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu number={ number } { ...this.props }/>
+						<article>
+							{ loading ? (
+								<div
+									className="table_row table_header"
+									style={{
+										minHeight: 300,
+										display: "flex",
+										justifyContent: "center",
+										alignItems: "center",
+									}}
+								>
+									<SpinnerCircular
+										size={90}
+										thickness={51}
+										speed={100}
+										color="rgba(28, 1, 169, 1)"
+										secondaryColor="rgba(236, 239, 244, 1)"
+									/>
+								</div>
+							) : (
+								<>
+									<div className="dropdown_blocks_list">
+										{documents !== undefined && documents !== null ? (
+											<>
+												{this._renderFines(documents.fines, "fines")}
+											</>
+										) : null}
+									</div>
+								</>
+							) }
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
-		);
+		)
 	}
 }
 
@@ -592,7 +383,7 @@ export const getServerSideProps = reduxWrapper.getServerSideProps(
 			props: {
 				number: query.number,
 			},
-		};
+		}
 	}
 );
 
diff --git a/pages/contract/index.js b/pages/contract/index.js
index 4f21827..e76da45 100644
--- a/pages/contract/index.js
+++ b/pages/contract/index.js
@@ -15,6 +15,7 @@ import Company from "../components/Company";
 import InnerMenu from "./components/InnerMenu";
 
 import { getContract, getContractDebtInvoiceFile, getContractInfo, getContractPenaltyInvoiceFile } from './../../actions';
+import AccountLayout from "../components/Layout/Account";
 
 class ContractSchedulePage extends React.Component 
 {
@@ -125,7 +126,6 @@ class ContractSchedulePage extends React.Component
 		{
 			this.setState({ penalty_invoice_file_loading: true }, () => 
 			{
-				/*
 				getContractPenaltyInvoiceFile({ contract: number })
 				.then(() => 
 				{
@@ -135,7 +135,6 @@ class ContractSchedulePage extends React.Component
 				{
 					this.setState({ penalty_invoice_file_loading: false });
 				});
-				*/
 			});
 		}
 	}
@@ -143,7 +142,7 @@ class ContractSchedulePage extends React.Component
 	_handle_onCalculatePenalty = () => 
 	{
 		const { number } = this.props;
-		this.props.router.push(`/contract/${ number }/documents`);
+		this.props.router.push(`/contract/${ number }/documents#penalties`);
 	}
 
 	render()
@@ -180,158 +179,153 @@ class ContractSchedulePage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ flexDirection: 'column', }}>
-									<h1 className="section_title">Договор №{ number }</h1>
-									<p className="section_subtitle">{ date !== undefined && date !== null && date !== null && (<> от { moment(date).format("DD.MM.YYYY") }</>)}{ car !== undefined && car !== null ? ` - ${ car.brand.name } ${ car.model.name } | ${ car.reg_number !== null ? car.reg_number : 'без рег. номера' } | ${ car.vin_number !== null ? car.vin_number : 'без VIN номера' }` : '' }</p>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu number={ number } { ...this.props }/>
-								<article>
-									{ parseInt(avans, 10) > 0 && (
-										<div className="payments_actions"> 
-											<div className="avans">
-												<p>Сумма авансовых поступлений по договору: <span style={{ whiteSpace: "nowrap" }}>{ numeral(avans).format(' ., ') }&nbsp;₽</span></p>
-											</div>
-										</div>
-									) }
-									{/* Вариант 1 */}
-									<div className="payments_actions">
-										{ parseInt(debt, 10) > 0 && (
-											<div>
-												<p>Счёт на основной долг: { numeral(debt).format(' ., ') }&nbsp;₽</p>
-												<button className="button button-blue" onClick={ this._handle_onDownloadDebtFile } style={{ minWidth: 113 }}>
-													{ debt_invoice_file_loading ? (
-														<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "0px" }}/>
-													) : 
-														("Скачать счет") 
-													}
-												</button>
-											</div>
-										) }
-										{ parseInt(penalty, 10) > 0 && (
-											<div>
-												<p><span>Пени:</span> { numeral(penalty).format(' ., ') }&nbsp;₽</p>
-												<button className="button button-blue" onClick={ this._handle_onDownloadPenaltyFile } style={{ minWidth: 113 }}>
-													{ penalty_invoice_file_loading ? (
-														<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "0px" }}/>
-													) : 
-														("Скачать счет") 
-													}
-												</button>
-												<button className="button button-blue" onClick={ this._handle_onCalculatePenalty }>Рассчитать пени</button>
-											</div>
-										) }
-									</div>
-									<div className="contract_table schedule">
-										<div className="table_row table_header">
-											<div className="table_cell">№ платежа</div>
-											<div className="table_cell">Дата лизингового платежа</div>
-											<div className="table_cell">Лизинговый платеж с НДС ₽</div>
-											<div className="table_cell">НДС, 20% ₽</div>
-											<div className="table_cell">Статус платежа</div>
-											<div className="table_cell">Платежное поручение</div>
-										</div>
-										{ loading ? (
-											<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
-												<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-											</div>
-										) : (
-											<>
-												{ !full && (
-													<button className="show_more primary" onClick={ this._handle_onSetFull }>Показать прошедшие платежи</button>
-												) }
-												{ payments !== undefined && payments !== null && Object.values(payments).map((payment, index) => 
-												{
-													let pd = moment(payment.date, "DD-MM-YYYY");
-													if(!full && pd < last_pay_date) { return null; }
-
-													return (
-														<div className={ `table_row ${ opened.indexOf(payment.number) > -1 ? "opened" : "" }` } data-status={ payment.status === "NotPaid" && pd < today ? "notpaid" : statuses[payment.status] } key={ index } onClick={ () => this._handle_onSetOpen(payment.number) }>
-															<div className="table_cell" data-title="Платеж №">{ payment.number }</div>
-															<div className="table_cell" data-title="от">{ moment(payment.date, "DD-MM-YYYY").format("DD.MM.YYYY") }</div>
-															<div className="table_cell" data-title="На сумму" style={{ whiteSpace: "nowrap" }}>{ numeral(payment.total_amount).format(' ., ') }&nbsp;₽</div>
-															<div className="table_cell" data-title="НДС, 20%" style={{ whiteSpace: "nowrap" }}>{ numeral(payment.vat_amount).format(' ., ') }&nbsp;₽</div>
-															<div className="table_cell">
-																{ payment.status === "Paid" && "Оплачено" }
-																{ payment.status === "NotPaid" && "Не оплачено" }
-																{ payment.status === "HalfPaid" && (
-																	<><span>Недоплата</span><br/><span style={{ whiteSpace: "nowrap" }}>{ numeral(payment.total_amount - payment.paid_amount).format(' ., ') }&nbsp;₽</span></>
-																) }
-																{ payment.status === "OverPaid" && (
-																	<><span>Переплата</span> <span style={{ whiteSpace: "nowrap" }}>{ numeral(payment.total_amount).format(' ., ') }&nbsp;₽</span></>
-																) }
-															</div>
-															<div className="table_cell">
-																{ payment.invoices !== undefined && payment.invoices.map((invoice, invoice_index) => 
-																(
-																	<React.Fragment key={invoice_index}>
-																	<p style={{ paddingBottom: "15px", lineHeight: "18px" }}>№{ invoice.number } от { moment(invoice.date, "DD-MM-YYYY").format("DD.MM.YYYY") } на сумму <span style={{ whiteSpace: "nowrap" }}>{ numeral(invoice.total_amount).format(' ., ') }&nbsp;₽</span></p>
-																	</React.Fragment>
-																)) }
-															</div>
-															<button className="toggle_cell" ></button>
-														</div>
-													)
-												}) }
-												{/*}
-												<div className="table_row" data-status="overpayment-2">
-													<div className="table_cell" data-title="Платеж №">11</div>
-													<div className="table_cell" data-title="от">21.02.2021</div>
-													<div className="table_cell" data-title="На сумму">239 724,05</div>
-													<div className="table_cell" data-title="НДС, 20% ₽">43 079,18</div>
-													<div className="table_cell"><span>Переплата</span> <span>15 000,00 ₽</span></div>
-													<div className="table_cell">№18432 от 20/01/2021 на сумму 255 000,00 ₽</div>
-
-													<button className="toggle_cell"></button>
-												</div>
-												<div className="table_row opened" data-status="overpayment-1">
-													<div className="table_cell" data-title="Платеж №">12</div>
-													<div className="table_cell" data-title="от">21.02.2021</div>
-													<div className="table_cell" data-title="На сумму">239 724,05</div>
-													<div className="table_cell" data-title="НДС, 20% ₽">43 079,18</div>
-													<div className="table_cell">Переплата 10 000,00 ₽</div>
-													<div className="table_cell">№34223 от 21/02/2021 на сумму 229 724,05 ₽</div>
-
-													<button className="toggle_cell"></button>
-												</div>
-												<div className="table_row" data-status="paid">
-													<div className="table_cell" data-title="Платеж №">13</div>
-													<div className="table_cell" data-title="от">21.02.2021</div>
-													<div className="table_cell" data-title="На сумму">239 724,05</div>
-													<div className="table_cell" data-title="НДС, 20% ₽">43 079,18</div>
-													<div className="table_cell">Оплачено </div>
-													<div className="table_cell">№44911 от 10/03/2021 на сумму 100 000,00 ₽
-													№49877 от 21/03/2021 на сумму 139 724,05 ₽</div>
-
-													<button className="toggle_cell"></button>
-												</div>
-												<div className="table_row">
-													<div className="table_cell" data-title="Платеж №">14</div>
-													<div className="table_cell" data-title="от">21.02.2021</div>
-													<div className="table_cell" data-title="На сумму">239 724,05</div>
-													<div className="table_cell" data-title="НДС, 20% ₽">43 079,18</div>
-													<div className="table_cell">Не оплачено </div>
-													<div className="table_cell">-</div>
-
-													<button className="toggle_cell"></button>
-												</div>
-												{*/}
-											</>
-										) }
-									</div>
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: 'column', }}>
+							<h1 className="section_title">Договор №{ number }</h1>
+							<p className="section_subtitle">{ date !== undefined && date !== null && date !== null && (<> от { moment(date).format("DD.MM.YYYY") }</>)}{ car !== undefined && car !== null ? ` - ${ car.brand.name } ${ car.model.name } | ${ car.reg_number !== null ? car.reg_number : 'без рег. номера' } | ${ car.vin_number !== null ? car.vin_number : 'без VIN номера' }` : '' }</p>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu number={ number } { ...this.props }/>
+						<article>
+							{ parseInt(avans, 10) > 0 && (
+								<div className="payments_actions"> 
+									<div className="avans">
+										<p>Сумма авансовых поступлений по договору: <span style={{ whiteSpace: "nowrap" }}>{ numeral(avans).format(' ., ') }&nbsp;₽</span></p>
+									</div>
+								</div>
+							) }
+							{/* Вариант 1 */}
+							<div className="payments_actions">
+								{ parseInt(debt, 10) > 0 && (
+									<div>
+										<p>Счёт на основной долг: { numeral(debt).format(' ., ') }&nbsp;₽</p>
+										<button className="button button-blue" onClick={ this._handle_onDownloadDebtFile } style={{ minWidth: 113 }}>
+											{ debt_invoice_file_loading ? (
+												<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "0px" }}/>
+											) : 
+												("Скачать счет") 
+											}
+										</button>
+									</div>
+								) }
+								{ parseInt(penalty, 10) > 0 && (
+									<div>
+										<p><span>Пени:</span> { numeral(penalty).format(' ., ') }&nbsp;₽</p>
+										<button className="button button-blue" onClick={ this._handle_onDownloadPenaltyFile } style={{ minWidth: 113 }}>
+											{ penalty_invoice_file_loading ? (
+												<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "0px" }}/>
+											) : 
+												("Скачать счет") 
+											}
+										</button>
+										<button className="button button-blue" onClick={ this._handle_onCalculatePenalty }>Рассчитать пени</button>
+									</div>
+								) }
+							</div>
+							<div className="contract_table schedule">
+								<div className="table_row table_header">
+									<div className="table_cell">№ платежа</div>
+									<div className="table_cell">Дата лизингового платежа</div>
+									<div className="table_cell">Лизинговый платеж с НДС ₽</div>
+									<div className="table_cell">НДС, 20% ₽</div>
+									<div className="table_cell">Статус платежа</div>
+									<div className="table_cell">Платежное поручение</div>
+								</div>
+								{ loading ? (
+									<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
+										<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
+									</div>
+								) : (
+									<>
+										{ !full && (
+											<button className="show_more primary" onClick={ this._handle_onSetFull }>Показать прошедшие платежи</button>
+										) }
+										{ payments !== undefined && payments !== null && Object.values(payments).map((payment, index) => 
+										{
+											let pd = moment(payment.date, "DD-MM-YYYY");
+											if(!full && pd < last_pay_date) { return null; }
+
+											return (
+												<div className={ `table_row ${ opened.indexOf(payment.number) > -1 ? "opened" : "" }` } data-status={ payment.status === "NotPaid" && pd < today ? "notpaid" : statuses[payment.status] } key={ index } onClick={ () => this._handle_onSetOpen(payment.number) }>
+													<div className="table_cell" data-title="Платеж №">{ payment.number }</div>
+													<div className="table_cell" data-title="от">{ moment(payment.date, "DD-MM-YYYY").format("DD.MM.YYYY") }</div>
+													<div className="table_cell" data-title="На сумму" style={{ whiteSpace: "nowrap" }}>{ numeral(payment.total_amount).format(' ., ') }&nbsp;₽</div>
+													<div className="table_cell" data-title="НДС, 20%" style={{ whiteSpace: "nowrap" }}>{ numeral(payment.vat_amount).format(' ., ') }&nbsp;₽</div>
+													<div className="table_cell">
+														{ payment.status === "Paid" && "Оплачено" }
+														{ payment.status === "NotPaid" && "Не оплачено" }
+														{ payment.status === "HalfPaid" && (
+															<><span>Недоплата</span><br/><span style={{ whiteSpace: "nowrap" }}>{ numeral(payment.total_amount - payment.paid_amount).format(' ., ') }&nbsp;₽</span></>
+														) }
+														{ payment.status === "OverPaid" && (
+															<><span>Переплата</span> <span style={{ whiteSpace: "nowrap" }}>{ numeral(payment.total_amount).format(' ., ') }&nbsp;₽</span></>
+														) }
+													</div>
+													<div className="table_cell">
+														{ payment.invoices !== undefined && payment.invoices.map((invoice, invoice_index) => 
+														(
+															<React.Fragment key={invoice_index}>
+															<p style={{ paddingBottom: "15px", lineHeight: "18px" }}>№{ invoice.number } от { moment(invoice.date, "DD-MM-YYYY").format("DD.MM.YYYY") } на сумму <span style={{ whiteSpace: "nowrap" }}>{ numeral(invoice.total_amount).format(' ., ') }&nbsp;₽</span></p>
+															</React.Fragment>
+														)) }
+													</div>
+													<button className="toggle_cell" ></button>
+												</div>
+											)
+										}) }
+										{/*}
+										<div className="table_row" data-status="overpayment-2">
+											<div className="table_cell" data-title="Платеж №">11</div>
+											<div className="table_cell" data-title="от">21.02.2021</div>
+											<div className="table_cell" data-title="На сумму">239 724,05</div>
+											<div className="table_cell" data-title="НДС, 20% ₽">43 079,18</div>
+											<div className="table_cell"><span>Переплата</span> <span>15 000,00 ₽</span></div>
+											<div className="table_cell">№18432 от 20/01/2021 на сумму 255 000,00 ₽</div>
+
+											<button className="toggle_cell"></button>
+										</div>
+										<div className="table_row opened" data-status="overpayment-1">
+											<div className="table_cell" data-title="Платеж №">12</div>
+											<div className="table_cell" data-title="от">21.02.2021</div>
+											<div className="table_cell" data-title="На сумму">239 724,05</div>
+											<div className="table_cell" data-title="НДС, 20% ₽">43 079,18</div>
+											<div className="table_cell">Переплата 10 000,00 ₽</div>
+											<div className="table_cell">№34223 от 21/02/2021 на сумму 229 724,05 ₽</div>
+
+											<button className="toggle_cell"></button>
+										</div>
+										<div className="table_row" data-status="paid">
+											<div className="table_cell" data-title="Платеж №">13</div>
+											<div className="table_cell" data-title="от">21.02.2021</div>
+											<div className="table_cell" data-title="На сумму">239 724,05</div>
+											<div className="table_cell" data-title="НДС, 20% ₽">43 079,18</div>
+											<div className="table_cell">Оплачено </div>
+											<div className="table_cell">№44911 от 10/03/2021 на сумму 100 000,00 ₽
+											№49877 от 21/03/2021 на сумму 139 724,05 ₽</div>
+
+											<button className="toggle_cell"></button>
+										</div>
+										<div className="table_row">
+											<div className="table_cell" data-title="Платеж №">14</div>
+											<div className="table_cell" data-title="от">21.02.2021</div>
+											<div className="table_cell" data-title="На сумму">239 724,05</div>
+											<div className="table_cell" data-title="НДС, 20% ₽">43 079,18</div>
+											<div className="table_cell">Не оплачено </div>
+											<div className="table_cell">-</div>
+
+											<button className="toggle_cell"></button>
+										</div>
+										{*/}
+									</>
+								) }
+							</div>
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/contract/materials.js b/pages/contract/materials.js
index 181d013..8146c27 100644
--- a/pages/contract/materials.js
+++ b/pages/contract/materials.js
@@ -15,6 +15,7 @@ import InnerMenu from "./components/InnerMenu";
 import DownloadPdfButton from "../components/DownloadPdfButton";
 
 import { getContractInfo, getContractMaterials } from "../../actions";
+import AccountLayout from "../components/Layout/Account";
 
 class ContractPage extends React.Component 
 {
@@ -81,45 +82,40 @@ class ContractPage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ flexDirection: 'column', }}>
-									<h1 className="section_title">Договор №{ number }</h1>
-									<h5 style={{ fontSize: '14px' }}>{ date !== undefined && date !== null && date !== null && (<> от { moment(date).format("DD.MM.YYYY") }</>)}{ car !== undefined && car !== null ? ` - ${ car.brand.name } ${ car.model.name } | ${ car.reg_number !== null ? car.reg_number : 'без рег. номера' } | ${ car.vin_number !== null ? car.vin_number : 'без VIN номера' }` : '' }</h5>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu number={ number } { ...this.props }/>
-								<article>
-									{ loading ? (
-										<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
-											<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-										</div>
-									) : (
-										<div className="dosc_list">
-											{ materials !== undefined && materials !== null && materials.map((document, index ) => (
-												<div className="row" key={ index }>
-													<p className="doc_name i-pdf">
-														{ document.name }
-														{ document.description !== null && document.description !== "" && (
-															<span style={{ width: "100%"}}>{ document.description }</span>
-														) }
-													</p>
-													<DownloadPdfButton url={ `${ process.env.NEXT_PUBLIC_MAIN_SITE }${ document.url }` } filename={ `${ document.filename }.pdf` } bitrix={ true }/>
-												</div>
-											)) }
-										</div>
-									) }
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: 'column', }}>
+							<h1 className="section_title">Договор №{ number }</h1>
+							<h5 style={{ fontSize: '14px' }}>{ date !== undefined && date !== null && date !== null && (<> от { moment(date).format("DD.MM.YYYY") }</>)}{ car !== undefined && car !== null ? ` - ${ car.brand.name } ${ car.model.name } | ${ car.reg_number !== null ? car.reg_number : 'без рег. номера' } | ${ car.vin_number !== null ? car.vin_number : 'без VIN номера' }` : '' }</h5>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu number={ number } { ...this.props }/>
+						<article>
+							{ loading ? (
+								<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
+									<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
+								</div>
+							) : (
+								<div className="dosc_list">
+									{ materials !== undefined && materials !== null && materials.map((document, index ) => (
+										<div className="row" key={ index }>
+											<p className="doc_name i-pdf">
+												{ document.name }
+												{ document.description !== null && document.description !== "" && (
+													<span style={{ width: "100%"}}>{ document.description }</span>
+												) }
+											</p>
+											<DownloadPdfButton url={ `${ process.env.NEXT_PUBLIC_MAIN_SITE }${ document.url }` } filename={ `${ document.filename }.pdf` } bitrix={ true }/>
+										</div>
+									)) }
+								</div>
+							) }
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/contract/services.js b/pages/contract/services.js
index 280eb66..fa14866 100644
--- a/pages/contract/services.js
+++ b/pages/contract/services.js
@@ -16,6 +16,7 @@ import InnerMenu from "./components/InnerMenu";
 
 import { getContractInfo, getContractHelpCard, getContractInsurance, getContractRegistration, getContractTelematic, } from './../../actions';
 import DownloadPdfButton from "../components/DownloadPdfButton";
+import AccountLayout from "../components/Layout/Account";
 
 class ContractServicesPage extends React.Component 
 {
@@ -163,274 +164,269 @@ class ContractServicesPage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ flexDirection: 'column', }}>
-									<h1 className="section_title">Договор №{ number }</h1>
-									<h5 style={{ fontSize: '14px' }}>{ date !== undefined && date !== null && date !== null && (<> от { moment(date).format("DD.MM.YYYY") }</>)}{ car !== undefined && car !== null ? ` - ${ car.brand.name } ${ car.model.name } | ${ car.reg_number !== null ? car.reg_number : 'без рег. номера' } | ${ car.vin_number !== null ? car.vin_number : 'без VIN номера' }` : '' }</h5>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: 'column', }}>
+							<h1 className="section_title">Договор №{ number }</h1>
+							<h5 style={{ fontSize: '14px' }}>{ date !== undefined && date !== null && date !== null && (<> от { moment(date).format("DD.MM.YYYY") }</>)}{ car !== undefined && car !== null ? ` - ${ car.brand.name } ${ car.model.name } | ${ car.reg_number !== null ? car.reg_number : 'без рег. номера' } | ${ car.vin_number !== null ? car.vin_number : 'без VIN номера' }` : '' }</h5>
+						</div>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu number={ number } { ...this.props }/>
+						<article>
+							{ loading ? (
+								<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
+									<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
 								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu number={ number } { ...this.props }/>
-								<article>
-									{ loading ? (
-										<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
-											<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
+							) : (									
+								<div className="dropdown_blocks_list zero-margin">
+									
+									<div className={`dropdown_block ${ opened.indexOf("ratcard") > -1 ? 'open' : '' }`}>
+										<div className="block_header" onClick={ () => this._handle_onCard('ratcard') }>
+											<p className="with-icon">
+												<img src="/assets/images/lk/additional-1.svg" alt="Карта РАТ" width="32px" height="32px"  />
+												Карта РАТ
+											</p>
+											<button className="block_toggle"></button>
 										</div>
-									) : (									
-										<div className="dropdown_blocks_list zero-margin">
-											
-											<div className={`dropdown_block ${ opened.indexOf("ratcard") > -1 ? 'open' : '' }`}>
-												<div className="block_header" onClick={ () => this._handle_onCard('ratcard') }>
-													<p className="with-icon">
-														<img src="/assets/images/lk/additional-1.svg" alt="Карта РАТ" width="32px" height="32px"  />
-														Карта РАТ
-													</p>
-													<button className="block_toggle"></button>
-												</div>
-												{ helpcard !== undefined && helpcard !== null && helpcard.length > 0 ? (
-													helpcard.map((entry, index) => (
-														<React.Fragment key={ index }>
-															{ entry.card_number !== null ? (
-																<div className="block_body">
-																	<div className="company">
-																		<p className="title">РАТ</p>
-																		<ul>
-																		<li>Номер карты: <b>{ entry.card_number }</b></li>
-																		<li>Тип карты: <b>{ entry.card_type }</b></li>
-																		<li>Действует до: <b>{ moment(entry.date).format("DD.MM.YYYY") }</b></li>
-																		</ul>
-																	</div>
-																	<>
-																		{ entry && entry.description && (
-																			<p dangerouslySetInnerHTML={{ __html: entry.description.replace(/;/g, ";<br/>") }}/>
-																		) }
-																	</>
-																</div>
-															) : (
-																<div className="block_body"><p>Нет данных</p></div>
-															) }
-														</React.Fragment>
-													))
-												) : (
-													<div className="block_body"><p>Нет данных</p></div>
-												) }
-											</div>
-
-											<div className={`dropdown_block ${ opened.indexOf("insurance") > -1 ? 'open' : '' }`}>
-												<div className="block_header" onClick={ () => this._handle_onCard('insurance') }>
-													<p className="with-icon">
-														<img src="/assets/images/lk/additional-2.svg" alt="Страхование" width="32px" height="32px"  />
-														Страхование
-													</p>
-													<button className="block_toggle"></button>
-												</div>
-												<div className="block_body full">
-													{/*}
-													<div className="company filled">
-														<p className="title">КАСКО</p>
-														<ul>
-															<li>Страховая компания: <b>Согласие</b></li>
-															<li>Сайт: <b>www.sogl.ru</b></li>
-															<li>Телефон: <b>34234324324324</b></li>
-															<li>Номер полиса: <b style={{ color: "#1C01A9" }}>34234324324324</b></li>
-															<li>Период действия: <b>01/01/2020 - 01/01/2025</b></li>
-															<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>3 400 000,00 ₽&nbsp;₽</b></li>
-															<li className="alert">Обращаем Ваше внимание, что пролонгация полиса ОСАГО на второй и последующие периоды осуществляется Лизингополучателем самостоятельно</li>
-														</ul>
-														<div className="action">
-															<button className="button button-blue">Скачать счет на оплату</button>
+										{ helpcard !== undefined && helpcard !== null && helpcard.length > 0 ? (
+											helpcard.map((entry, index) => (
+												<React.Fragment key={ index }>
+													{ entry.card_number !== null ? (
+														<div className="block_body">
+															<div className="company">
+																<p className="title">РАТ</p>
+																<ul>
+																<li>Номер карты: <b>{ entry.card_number }</b></li>
+																<li>Тип карты: <b>{ entry.card_type }</b></li>
+																<li>Действует до: <b>{ moment(entry.date).format("DD.MM.YYYY") }</b></li>
+																</ul>
+															</div>
+															<>
+																{ entry && entry.description && (
+																	<p dangerouslySetInnerHTML={{ __html: entry.description.replace(/;/g, ";<br/>") }}/>
+																) }
+															</>
 														</div>
-													</div>
-													{*/}
-													{ insurance !== undefined && insurance !== null ? (
-														<>
-															{ insurance.kasko !== undefined && insurance.kasko !== null && insurance.kasko !== "" && insurance.kasko.map !== undefined && insurance.kasko.map((entry, index) => (
-																<React.Fragment key={ index }>
-																	<div className={ `company ${ entry.period_type === "prolong" && "filled" }` }>
-																		<p className="title">КАСКО</p>
-																		<ul>
-																			{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
-																			{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
-																			{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
-																			{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
-																			{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
-																			{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
-																			{ entry.period_type === "prolong" && (
-																				<li className="alert">Обращаем Ваше внимание, что пролонгация полиса КАСКО на второй и последующие периоды осуществляется Лизингополучателем самостоятельно</li>
-																			) }
-																		</ul>
-																		{ entry.period_type === "prolong" && entry.invoice_url !== null && (
-																			<div className="action">
-																				<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
-																			</div>
-																		) }
-																	</div>
-																	{ entry.description && (<p>{ entry.description }</p>) }
-																</React.Fragment>
-															)) }
-															{ insurance.osago !== undefined && insurance.osago !== null && insurance.osago !== "" && insurance.osago.map !== undefined && insurance.osago.map((entry, index) => (
-																<React.Fragment key={ index }>
-																	<div className={ `company ${ entry.period_type === "prolong" && "filled" }` }>
-																		<p className="title">ОСАГО</p>
-																		<ul>
-																			{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
-																			{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
-																			{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
-																			{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
-																			{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
-																			{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
-																		</ul>
-																		{ entry.period_type === "prolong" && entry.invoice_url !== null && (
-																			<div className="action">
-																				<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
-																				{/*}
-																				<button className="button button-blue" onClick={ () => this._handle_onInvoice(entry.invoice_url) }>Скачать счет на оплату</button>
-																				{*/}
-																			</div>
-																		) }
-																	</div>
-																	{ entry.description && (<p>{ entry.description }</p>) }
-																</React.Fragment>
-															)) }
-															{ insurance.nsib !== undefined && insurance.nsib !== null && insurance.nsib !== "" && insurance.nsib.map !== undefined && insurance.nsib.map((entry, index) => (
-																<React.Fragment key={ index }>
-																	<div className={ `company ${ entry.period_type === "prolong" && "filled" }` }>
-																		<p className="title">НСИБ</p>
-																		<ul>
-																			{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
-																			{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
-																			{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
-																			{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
-																			{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
-																			{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
-																		</ul>
-																		{ entry.period_type === "prolong" && entry.invoice_url !== null && (
-																			<div className="action">
-																				<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
-																				{/*}
-																				<button className="button button-blue" onClick={ () => this._handle_onInvoice(entry.invoice_url) }>Скачать счет на оплату</button>
-																				{*/}
-																			</div>
-																		) }
-																	</div>
-																	{ entry.description && (<p>{ entry.description }</p>) }
-																</React.Fragment>
-															)) }
-															{ insurance.fingap !== undefined && insurance.fingap !== null && insurance.fingap !== "" && insurance.fingap.map !== undefined && insurance.fingap.map((entry, index) => (
-																<React.Fragment key={ index }>
-																	<div className= { `company ${ entry.period_type === "prolong" && "filled" }` }>
-																		<p className="title">FinGAP</p>
-																		<ul>
-																			{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
-																			{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
-																			{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
-																			{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
-																			{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
-																			{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
-																			{ entry.period_type === "prolong" && (
-																				<li className="alert">Обращаем Ваше внимание, что пролонгация полиса FinGAP на второй и последующие периоды осуществляется Лизингополучателем самостоятельно</li>
-																			) }
-																		</ul>
-																		{ entry.period_type === "prolong" && entry.invoice_url !== null && (
-																			<div className="action">
-																				<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
-																				{/*}
-																				<button className="button button-blue" onClick={ () => this._handle_onInvoice(entry.invoice_url) }>Скачать счет на оплату</button>
-																				{*/}
-																			</div>
-																		) }
-																	</div>
-																	{ entry.description && (<p>{ entry.description }</p>) }
-																</React.Fragment>
-															)) }
-														</>
 													) : (
 														<div className="block_body"><p>Нет данных</p></div>
 													) }
-												</div>
-											</div>
-											<div className={`dropdown_block ${ opened.indexOf("registration") > -1 ? 'open' : '' }`}>
-												<div className="block_header" onClick={ () => this._handle_onCard('registration') }>
-													<p className="with-icon">
-														<img src="/assets/images/lk/additional-3.svg" alt="Регистрация" width="32px" height="32px" />
-														Регистрация
-													</p>
-													<button className="block_toggle"></button>
-												</div>
-												{ registration !== undefined && registration !== null && registration.length > 0 ? registration.map((entry, index) => 
-												(
-													<div className="block_body" key={ index }>
-														<div className="company">
-															<p className="title">ГИБДД</p>
-															<ul>
-															{ entry.package && (
-																<li>Пакет услуг: <b>{ entry.package }</b></li>
-															) }
-															{ entry.amount && (
-																<li>Стоимость: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') } ₽</b></li>
-															) }
-															</ul>
-														</div>
-													</div>
-												)) : (
-													<div className="block_body"><p>Нет данных</p></div>
-												) }
-											</div>
-											<div className={`dropdown_block ${ opened.indexOf("telematic") > -1 ? 'open' : '' }`}>
-												<div className="block_header" onClick={ () => this._handle_onCard('telematic') }>
-													<p className="with-icon">
-														<img src="/assets/images/lk/additional-4.svg" alt="Телематика" width="32px" height="32px"  />
-														Телематика
-													</p>
-													<button className="block_toggle"></button>
-												</div>
-												{ telematic !== undefined && telematic !== null && telematic.length > 0 ? telematic.map((entry, index) => 
-												(
-													<div className="block_body" key={ index }>
-														<div className="company">
-															<ul style={{ marginLeft: "0px" }}>
-															{ entry.provider && (
-															<li>Поставщик: <b>{ entry.provider }</b></li>
-															) }
-															{ entry.equipment && (
-																<li>Оборудование: <b>{ entry.equipment }</b></li>
-															) }
-															{ entry.amount && (
-																<li>Стоимость: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') } ₽</b></li>
-															) }
-															</ul>
-														</div>
-													</div>
-												)) : (
-													<div className="block_body"><p>Нет данных</p></div>
-												)}
-												{/*}
-												<div className="block_body">
-													<div className="company">
-														<ul>
-														<li>Сайт: <b>www.telematic.ru</b></li>
-														<li>Логин: <b>test</b></li>
-														<li>Пароль: <b>test</b></li>
-														</ul>
-													</div>
-													<p>Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент</p>
-												</div>
-												{*/}
-											</div>
+												</React.Fragment>
+											))
+										) : (
+											<div className="block_body"><p>Нет данных</p></div>
+										) }
+									</div>
 
+									<div className={`dropdown_block ${ opened.indexOf("insurance") > -1 ? 'open' : '' }`}>
+										<div className="block_header" onClick={ () => this._handle_onCard('insurance') }>
+											<p className="with-icon">
+												<img src="/assets/images/lk/additional-2.svg" alt="Страхование" width="32px" height="32px"  />
+												Страхование
+											</p>
+											<button className="block_toggle"></button>
 										</div>
-									) }
-								</article>
-							</div>
-						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+										<div className="block_body full">
+											{/*}
+											<div className="company filled">
+												<p className="title">КАСКО</p>
+												<ul>
+													<li>Страховая компания: <b>Согласие</b></li>
+													<li>Сайт: <b>www.sogl.ru</b></li>
+													<li>Телефон: <b>34234324324324</b></li>
+													<li>Номер полиса: <b style={{ color: "#1C01A9" }}>34234324324324</b></li>
+													<li>Период действия: <b>01/01/2020 - 01/01/2025</b></li>
+													<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>3 400 000,00 ₽&nbsp;₽</b></li>
+													<li className="alert">Обращаем Ваше внимание, что пролонгация полиса ОСАГО на второй и последующие периоды осуществляется Лизингополучателем самостоятельно</li>
+												</ul>
+												<div className="action">
+													<button className="button button-blue">Скачать счет на оплату</button>
+												</div>
+											</div>
+											{*/}
+											{ insurance !== undefined && insurance !== null ? (
+												<>
+													{ insurance.kasko !== undefined && insurance.kasko !== null && insurance.kasko !== "" && insurance.kasko.map !== undefined && insurance.kasko.map((entry, index) => (
+														<React.Fragment key={ index }>
+															<div className={ `company ${ entry.period_type === "prolong" && "filled" }` }>
+																<p className="title">КАСКО</p>
+																<ul>
+																	{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
+																	{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
+																	{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
+																	{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
+																	{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
+																	{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
+																	{ entry.period_type === "prolong" && (
+																		<li className="alert">Обращаем Ваше внимание, что пролонгация полиса КАСКО на второй и последующие периоды осуществляется Лизингополучателем самостоятельно</li>
+																	) }
+																</ul>
+																{ entry.period_type === "prolong" && entry.invoice_url !== null && (
+																	<div className="action">
+																		<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
+																	</div>
+																) }
+															</div>
+															{ entry.description && (<p>{ entry.description }</p>) }
+														</React.Fragment>
+													)) }
+													{ insurance.osago !== undefined && insurance.osago !== null && insurance.osago !== "" && insurance.osago.map !== undefined && insurance.osago.map((entry, index) => (
+														<React.Fragment key={ index }>
+															<div className={ `company ${ entry.period_type === "prolong" && "filled" }` }>
+																<p className="title">ОСАГО</p>
+																<ul>
+																	{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
+																	{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
+																	{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
+																	{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
+																	{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
+																	{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
+																</ul>
+																{ entry.period_type === "prolong" && entry.invoice_url !== null && (
+																	<div className="action">
+																		<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
+																		{/*}
+																		<button className="button button-blue" onClick={ () => this._handle_onInvoice(entry.invoice_url) }>Скачать счет на оплату</button>
+																		{*/}
+																	</div>
+																) }
+															</div>
+															{ entry.description && (<p>{ entry.description }</p>) }
+														</React.Fragment>
+													)) }
+													{ insurance.nsib !== undefined && insurance.nsib !== null && insurance.nsib !== "" && insurance.nsib.map !== undefined && insurance.nsib.map((entry, index) => (
+														<React.Fragment key={ index }>
+															<div className={ `company ${ entry.period_type === "prolong" && "filled" }` }>
+																<p className="title">НСИБ</p>
+																<ul>
+																	{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
+																	{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
+																	{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
+																	{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
+																	{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
+																	{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
+																</ul>
+																{ entry.period_type === "prolong" && entry.invoice_url !== null && (
+																	<div className="action">
+																		<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
+																		{/*}
+																		<button className="button button-blue" onClick={ () => this._handle_onInvoice(entry.invoice_url) }>Скачать счет на оплату</button>
+																		{*/}
+																	</div>
+																) }
+															</div>
+															{ entry.description && (<p>{ entry.description }</p>) }
+														</React.Fragment>
+													)) }
+													{ insurance.fingap !== undefined && insurance.fingap !== null && insurance.fingap !== "" && insurance.fingap.map !== undefined && insurance.fingap.map((entry, index) => (
+														<React.Fragment key={ index }>
+															<div className= { `company ${ entry.period_type === "prolong" && "filled" }` }>
+																<p className="title">FinGAP</p>
+																<ul>
+																	{ entry.company && (<li>Страховая компания: <b>{ entry.company }</b></li>) }
+																	{ entry.site && (<li>Сайт: <b>{ entry.site }</b></li>) }
+																	{ entry.phone && (<li>Телефон: <b>{ entry.phone }</b></li>) }
+																	{ entry.number && (<li>Номер полиса: <b style={ entry.url !== null ? { color: "#1C01A9", cursor: "pointer", } : {} } onClick={ () => { entry.url !== null ? this._handle_onContract(entry.url) : {} } }>{ entry.number }</b></li>) }
+																	{ entry.period && (<li>Период действия: <b>{ entry.period }</b></li>) }
+																	{ entry.amount && (<li>Страховая сумма: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') }&nbsp;₽</b></li>) }
+																	{ entry.period_type === "prolong" && (
+																		<li className="alert">Обращаем Ваше внимание, что пролонгация полиса FinGAP на второй и последующие периоды осуществляется Лизингополучателем самостоятельно</li>
+																	) }
+																</ul>
+																{ entry.period_type === "prolong" && entry.invoice_url !== null && (
+																	<div className="action">
+																		<DownloadPdfButton id={ entry.invoice_url } title="Скачать счет на оплату"/>
+																		{/*}
+																		<button className="button button-blue" onClick={ () => this._handle_onInvoice(entry.invoice_url) }>Скачать счет на оплату</button>
+																		{*/}
+																	</div>
+																) }
+															</div>
+															{ entry.description && (<p>{ entry.description }</p>) }
+														</React.Fragment>
+													)) }
+												</>
+											) : (
+												<div className="block_body"><p>Нет данных</p></div>
+											) }
+										</div>
+									</div>
+									<div className={`dropdown_block ${ opened.indexOf("registration") > -1 ? 'open' : '' }`}>
+										<div className="block_header" onClick={ () => this._handle_onCard('registration') }>
+											<p className="with-icon">
+												<img src="/assets/images/lk/additional-3.svg" alt="Регистрация" width="32px" height="32px" />
+												Регистрация
+											</p>
+											<button className="block_toggle"></button>
+										</div>
+										{ registration !== undefined && registration !== null && registration.length > 0 ? registration.map((entry, index) => 
+										(
+											<div className="block_body" key={ index }>
+												<div className="company">
+													<p className="title">ГИБДД</p>
+													<ul>
+													{ entry.package && (
+														<li>Пакет услуг: <b>{ entry.package }</b></li>
+													) }
+													{ entry.amount && (
+														<li>Стоимость: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') } ₽</b></li>
+													) }
+													</ul>
+												</div>
+											</div>
+										)) : (
+											<div className="block_body"><p>Нет данных</p></div>
+										) }
+									</div>
+									<div className={`dropdown_block ${ opened.indexOf("telematic") > -1 ? 'open' : '' }`}>
+										<div className="block_header" onClick={ () => this._handle_onCard('telematic') }>
+											<p className="with-icon">
+												<img src="/assets/images/lk/additional-4.svg" alt="Телематика" width="32px" height="32px"  />
+												Телематика
+											</p>
+											<button className="block_toggle"></button>
+										</div>
+										{ telematic !== undefined && telematic !== null && telematic.length > 0 ? telematic.map((entry, index) => 
+										(
+											<div className="block_body" key={ index }>
+												<div className="company">
+													<ul style={{ marginLeft: "0px" }}>
+													{ entry.provider && (
+													<li>Поставщик: <b>{ entry.provider }</b></li>
+													) }
+													{ entry.equipment && (
+														<li>Оборудование: <b>{ entry.equipment }</b></li>
+													) }
+													{ entry.amount && (
+														<li>Стоимость: <b style={{ whiteSpace: "nowrap" }}>{ numeral(entry.amount).format(' ., ') } ₽</b></li>
+													) }
+													</ul>
+												</div>
+											</div>
+										)) : (
+											<div className="block_body"><p>Нет данных</p></div>
+										)}
+										{/*}
+										<div className="block_body">
+											<div className="company">
+												<ul>
+												<li>Сайт: <b>www.telematic.ru</b></li>
+												<li>Логин: <b>test</b></li>
+												<li>Пароль: <b>test</b></li>
+												</ul>
+											</div>
+											<p>Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент</p>
+										</div>
+										{*/}
+									</div>
+
+								</div>
+							) }
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/documents/calendar.js b/pages/documents/calendar.js
index 9715458..67e272a 100644
--- a/pages/documents/calendar.js
+++ b/pages/documents/calendar.js
@@ -18,6 +18,7 @@ import CalendarCellModal from "../components/Modal/calendar";
 
 import { getCalendar } from '../../actions';
 import { MatchMedia } from '../../utils/mediaqueries';
+import AccountLayout from "../components/Layout/Account";
 
 class CalendarPage extends React.Component 
 {
@@ -235,88 +236,83 @@ class CalendarPage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left">
-									{/*[{ perweek ? 1 : 0 }, { current_week }, { selected_week }, { weeks_in_month }]*/}
-									<h1 className="section_title">Календарь оплат</h1>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu { ...this.props }/>
-								<article>
-									<div className="calendar_wrapper">
-										<div className="form_field">
-											{ periods_list.length > 0 && (
-												<select id="calendar_month" value={ periods_list.indexOf(selected_period) < 0 ? periods_list[periods_list.length - 1] : selected_period } onChange={ (event) => this._handle_onChangePeriod(event.target.value, 0) }>
-													{ periods !== null && periods_list.map((period, index) => (
-															<option key={ index } value={ period }>{ moment(period, "YYYYMM").format('MMMM YYYY') }</option>
-														)) }
-												</select>
-											) }
-										</div>
-										<div className="calendar_nav">
-											<button onClick={ () => this._handle_onWeek_prev() } disabled={ moment(selected_period, "YYYYMM").add(selected_week * 7, "day") <= moment(periods_list[0], "YYYYMM") ? true : false }>Предыдущая неделя</button>
-											<button onClick={ () => this._handle_onWeek_next() } disabled={ moment(selected_period, "YYYYMM").add(selected_week * 7, "day") >= moment(periods_list[periods_list.length - 1], "YYYYMM").add(1, "month") ? true : false }>Следующая неделя</button>
-										</div>
-										<div className="calendar_grid">
-											<div className="grid_header">
-												<div className="grid_cell">Пн</div>
-												<div className="grid_cell">Вт</div>
-												<div className="grid_cell">Ср</div>
-												<div className="grid_cell">Чт</div>
-												<div className="grid_cell">Пт</div>
-												<div className="grid_cell">Сб</div>
-												<div className="grid_cell">Вс</div>
-											</div>
-											<div className="grid_body">
-												{ render_weeks.map((week, week_index) => 
-												{
-													return (
-														<div className={week_index == 0 ? "grid_week active" : "grid_week"} key={"week_" + week_index}>
-															{ week.map((day, index) => {
-																if(day.payment)
-																{
-																	return (
-																		<div key={ index } style={{ cursor: "pointer" }} className={`grid_cell payment ${ !perweek && day.date.month() !== month ? 'disabled' : '' } ${ day.date.format("YYYYMMDD") === moment().format("YYYYMMDD") ? 'current' : '' } `} onClick={ () => this._handle_onDayClick(day) }>
-																			<div className="cell_header">
-																				<p><span>{ day.date.format("DD") }</span> { day.date.format("MMM").toLocaleLowerCase() } <span className="year">{ day.date.format("Y").toLocaleLowerCase() }</span></p>
-																			</div>
-																			<div className="cell_body">{ day.payment && (
-																				<p>
-																					Общий платеж
-																					<span style={ day.payment.total > 1000000 ? { fontSize: '14px', whiteSpace: "nowrap" } : { whiteSpace: "nowrap" }}>{ numeral(day.payment.total).format(' ., ') }&nbsp;₽</span>
-																				</p>
-																			)}
-																			</div>
-																		</div>
-																	)
-																}
-																return (
-																	<div key={ index } className={`grid_cell ${ !perweek && day.date.month() !== month ? 'disabled' : '' } ${ day.date.format("YYYYMMDD") === moment().format("YYYYMMDD") ? 'current' : '' } `}>
-																		<div className="cell_header">
-																			<p><span>{ day.date.format("DD") }</span> { day.date.format("MMM").toLocaleLowerCase() } <span className="year">{ day.date.format("Y").toLocaleLowerCase() }</span></p>
-																		</div>
-																	</div>
-																)
-															}) }
-														</div>
-													)
-												}) }
-											</div>
-										</div>
-									</div>
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left">
+							{/*[{ perweek ? 1 : 0 }, { current_week }, { selected_week }, { weeks_in_month }]*/}
+							<h1 className="section_title">Календарь оплат</h1>
 						</div>
-					</section>
-					<CalendarCellModal open={ this.state.modalOpened } selected_payment={ selected_payment } close={ () => this.toggleModal() }/>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu { ...this.props }/>
+						<article>
+							<div className="calendar_wrapper">
+								<div className="form_field">
+									{ periods_list.length > 0 && (
+										<select id="calendar_month" value={ periods_list.indexOf(selected_period) < 0 ? periods_list[periods_list.length - 1] : selected_period } onChange={ (event) => this._handle_onChangePeriod(event.target.value, 0) }>
+											{ periods !== null && periods_list.map((period, index) => (
+													<option key={ index } value={ period }>{ moment(period, "YYYYMM").format('MMMM YYYY') }</option>
+												)) }
+										</select>
+									) }
+								</div>
+								<div className="calendar_nav">
+									<button onClick={ () => this._handle_onWeek_prev() } disabled={ moment(selected_period, "YYYYMM").add(selected_week * 7, "day") <= moment(periods_list[0], "YYYYMM") ? true : false }>Предыдущая неделя</button>
+									<button onClick={ () => this._handle_onWeek_next() } disabled={ moment(selected_period, "YYYYMM").add(selected_week * 7, "day") >= moment(periods_list[periods_list.length - 1], "YYYYMM").add(1, "month") ? true : false }>Следующая неделя</button>
+								</div>
+								<div className="calendar_grid">
+									<div className="grid_header">
+										<div className="grid_cell">Пн</div>
+										<div className="grid_cell">Вт</div>
+										<div className="grid_cell">Ср</div>
+										<div className="grid_cell">Чт</div>
+										<div className="grid_cell">Пт</div>
+										<div className="grid_cell">Сб</div>
+										<div className="grid_cell">Вс</div>
+									</div>
+									<div className="grid_body">
+										{ render_weeks.map((week, week_index) => 
+										{
+											return (
+												<div className={week_index == 0 ? "grid_week active" : "grid_week"} key={"week_" + week_index}>
+													{ week.map((day, index) => {
+														if(day.payment)
+														{
+															return (
+																<div key={ index } style={{ cursor: "pointer" }} className={`grid_cell payment ${ !perweek && day.date.month() !== month ? 'disabled' : '' } ${ day.date.format("YYYYMMDD") === moment().format("YYYYMMDD") ? 'current' : '' } `} onClick={ () => this._handle_onDayClick(day) }>
+																	<div className="cell_header">
+																		<p><span>{ day.date.format("DD") }</span> { day.date.format("MMM").toLocaleLowerCase() } <span className="year">{ day.date.format("Y").toLocaleLowerCase() }</span></p>
+																	</div>
+																	<div className="cell_body">{ day.payment && (
+																		<p>
+																			Общий платеж
+																			<span style={ day.payment.total > 1000000 ? { fontSize: '14px', whiteSpace: "nowrap" } : { whiteSpace: "nowrap" }}>{ numeral(day.payment.total).format(' ., ') }&nbsp;₽</span>
+																		</p>
+																	)}
+																	</div>
+																</div>
+															)
+														}
+														return (
+															<div key={ index } className={`grid_cell ${ !perweek && day.date.month() !== month ? 'disabled' : '' } ${ day.date.format("YYYYMMDD") === moment().format("YYYYMMDD") ? 'current' : '' } `}>
+																<div className="cell_header">
+																	<p><span>{ day.date.format("DD") }</span> { day.date.format("MMM").toLocaleLowerCase() } <span className="year">{ day.date.format("Y").toLocaleLowerCase() }</span></p>
+																</div>
+															</div>
+														)
+													}) }
+												</div>
+											)
+										}) }
+									</div>
+								</div>
+							</div>
+						</article>
+					</div>
+				</AccountLayout>
+				<CalendarCellModal open={ this.state.modalOpened } selected_payment={ selected_payment } close={ () => this.toggleModal() }/>
+				<Footer/>
 			</React.Fragment>
 		)
 	}
diff --git a/pages/documents/finals.js b/pages/documents/finals.js
index 4626216..2df21ba 100644
--- a/pages/documents/finals.js
+++ b/pages/documents/finals.js
@@ -15,6 +15,7 @@ import InnerMenu from "./components/InnerMenu";
 import Company from "../components/Company";
 
 import { getContractsList } from '../../actions';
+import AccountLayout from "../components/Layout/Account";
 
 class FinalsPage extends React.Component 
 {
@@ -86,57 +87,52 @@ class FinalsPage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left">
-									<h1 className="section_title">Закрывающие документы</h1>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu { ...this.props }/>
-								<article>
-									<div className="contract_search">
-										<form onSubmit={ (event) => { event.preventDefault(); } }>
-											<div className="form_field single">
-												<input type="search" value={ search } placeholder="Поиск по номеру договора, марке и модели транспорта, VIN и госномеру ТС" onChange={ (event) => {
-													this._handle_onChange_search(event.target.value);
-												} }/>
-											</div>
-											<button className="button" disabled={ search !== "" ? false : true } onClick={ this._handle_onSearch }>Поиск</button>
-										</form>
-									</div>
-									{ loading ? (
-										<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
-											<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-										</div>
-									) : (
-										<div className="dosc_list" style={ contracts !== undefined && contracts !== null && contracts.length > 0 ? {} : { display: "flex", justifyContent: "center" }}>
-											{ contracts !== undefined && contracts !== null && (
-												<>
-													{ contracts.length > 0 ? contracts.map((contract, index) => (
-														<div className="row" key={ index }>
-															<p className="doc_name i-doc full">
-																<Link href={ `/contract/${ contract.number }/documents` }><a>Договор { contract.number } от { moment(contract.date).format("DD.MM.YYYY") }</a></Link>
-																<span>{ contract.car.brand.name } { contract.car.model.name } | { contract.car.reg_number !== undefined && contract.car.reg_number !== null ? contract.car.reg_number : "без рег. номера" } | { contract.car.vin_number }</span>
-															</p>
-														</div>
-													)) : (
-														<p>Нет договоров для отображения</p>
-													) }
-												</> 
-											) }
-										</div>
-									) }
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left">
+							<h1 className="section_title">Закрывающие документы</h1>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu { ...this.props }/>
+						<article>
+							<div className="contract_search">
+								<form onSubmit={ (event) => { event.preventDefault(); } }>
+									<div className="form_field single">
+										<input type="search" value={ search } placeholder="Поиск по номеру договора, марке и модели транспорта, VIN и госномеру ТС" onChange={ (event) => {
+											this._handle_onChange_search(event.target.value);
+										} }/>
+									</div>
+									<button className="button" disabled={ search !== "" ? false : true } onClick={ this._handle_onSearch }>Поиск</button>
+								</form>
+							</div>
+							{ loading ? (
+								<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
+									<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
+								</div>
+							) : (
+								<div className="dosc_list" style={ contracts !== undefined && contracts !== null && contracts.length > 0 ? {} : { display: "flex", justifyContent: "center" }}>
+									{ contracts !== undefined && contracts !== null && (
+										<>
+											{ contracts.length > 0 ? contracts.map((contract, index) => (
+												<div className="row" key={ index }>
+													<p className="doc_name i-doc full">
+														<Link href={ `/contract/${ contract.number }/documents` }><a>Договор { contract.number } от { moment(contract.date).format("DD.MM.YYYY") }</a></Link>
+														<span>{ contract.car.brand.name } { contract.car.model.name } | { contract.car.reg_number !== undefined && contract.car.reg_number !== null ? contract.car.reg_number : "без рег. номера" } | { contract.car.vin_number }</span>
+													</p>
+												</div>
+											)) : (
+												<p>Нет договоров для отображения</p>
+											) }
+										</> 
+									) }
+								</div>
+							) }
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		)
 	}
diff --git a/pages/documents/reconciliations.js b/pages/documents/reconciliations.js
index 6aef6bf..7ef005e 100644
--- a/pages/documents/reconciliations.js
+++ b/pages/documents/reconciliations.js
@@ -17,6 +17,7 @@ import DateInput from '../components/DatePicker';
 import { getContractsList, getReconciliationFile } from '../../actions';
 
 import { eachSeries } from "async";
+import AccountLayout from "../components/Layout/Account";
 
 
 class ReconciliationsPage extends React.Component 
@@ -226,73 +227,68 @@ class ReconciliationsPage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left">
-									<h1 className="section_title">Акты сверок</h1>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu { ...this.props }/>
-								<article>
-									<div className="acts_wrapper" style={{ flex: 1, justifyContent: "center" }}>
-										{ loading ? (
-											<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
-												<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-											</div>
-										) : (
-											<>
-												{ contracts !== undefined && contracts !== null && contracts.length > 0 ? (
-													<>
-														<div className="dosc_list acts_list-checkbox">
-															<div className="row">
-																<p className="doc_name">
-																	<input type="checkbox" name="all" id="all" checked={ checked_all } onChange={ this._handle_onAllContracts } />
-																	<label htmlFor="all">Все договоры</label>
-																</p>
-															</div>
-															{ contracts !== undefined && contracts !== null && contracts.map((contract, index) => (
-																<div className="row" key={ index }>
-																	<p className="doc_name i-pdf">
-																		<input type="checkbox" checked={ checked_all || checked.indexOf(contract.number) > -1 } name={ `contract_${ contract.number }` } id={ `contract_${ contract.number }` } onChange={ () => this._handle_onContract(contract.number) }/>
-																		<label htmlFor={ `contract_${ contract.number }` }>№{ contract.number } от { moment(contract.date).format("DD.MM.YYYY") }</label>
-																	</p>
-																</div>
-															)) }
-														</div>
-														<div className="reconciliation_form small" style={{ alignContent: "flex-start" }}>
-															<div className="form_field">
-																<DateInput placeholder="Дата начала периода" value={ period_date_start } min={ valid_date_start } max={ valid_date_end } onChange={ this._handle_onPeriodDate_start }/>
-															</div>
-															<div className="form_field">
-																<DateInput placeholder="Дата окончания периода" value={ period_date_end } min={ valid_date_start } max={ valid_date_end } onChange={ this._handle_onPeriodDate_end }/>
-															</div>
-															<button className="button button-blue" disabled={ reconciliation_disabled } onClick={ () => { this._handle_onReconciliationFiles() }}>
-																<>
-																	{ reconciliation_requested ? (
-																		<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" />
-																	) : "Скачать" }
-																</>
-															</button>
-															{/*<button className="button button-blue">Отправить в ЭДО</button>*/}
-														</div>
-													</>
-												) : (
-													<p>Нет договоров для запроса актов сверок</p>
-												) }
-											</>
-										) }
-									</div>
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left">
+							<h1 className="section_title">Акты сверок</h1>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu { ...this.props }/>
+						<article>
+							<div className="acts_wrapper" style={{ flex: 1, justifyContent: "center" }}>
+								{ loading ? (
+									<div className="table_row table_header" style={{ minHeight: 300, display: "flex", justifyContent: "center", alignItems: "center" }}>
+										<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
+									</div>
+								) : (
+									<>
+										{ contracts !== undefined && contracts !== null && contracts.length > 0 ? (
+											<>
+												<div className="dosc_list acts_list-checkbox">
+													<div className="row">
+														<p className="doc_name">
+															<input type="checkbox" name="all" id="all" checked={ checked_all } onChange={ this._handle_onAllContracts } />
+															<label htmlFor="all">Все договоры</label>
+														</p>
+													</div>
+													{ contracts !== undefined && contracts !== null && contracts.map((contract, index) => (
+														<div className="row" key={ index }>
+															<p className="doc_name i-pdf">
+																<input type="checkbox" checked={ checked_all || checked.indexOf(contract.number) > -1 } name={ `contract_${ contract.number }` } id={ `contract_${ contract.number }` } onChange={ () => this._handle_onContract(contract.number) }/>
+																<label htmlFor={ `contract_${ contract.number }` }>№{ contract.number } от { moment(contract.date).format("DD.MM.YYYY") }</label>
+															</p>
+														</div>
+													)) }
+												</div>
+												<div className="reconciliation_form small" style={{ alignContent: "flex-start" }}>
+													<div className="form_field">
+														<DateInput placeholder="Дата начала периода" value={ period_date_start } min={ valid_date_start } max={ valid_date_end } onChange={ this._handle_onPeriodDate_start }/>
+													</div>
+													<div className="form_field">
+														<DateInput placeholder="Дата окончания периода" value={ period_date_end } min={ valid_date_start } max={ valid_date_end } onChange={ this._handle_onPeriodDate_end }/>
+													</div>
+													<button className="button button-blue" disabled={ reconciliation_disabled } onClick={ () => { this._handle_onReconciliationFiles() }}>
+														<>
+															{ reconciliation_requested ? (
+																<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" />
+															) : "Скачать" }
+														</>
+													</button>
+													{/*<button className="button button-blue">Отправить в ЭДО</button>*/}
+												</div>
+											</>
+										) : (
+											<p>Нет договоров для запроса актов сверок</p>
+										) }
+									</>
+								) }
+							</div>
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		)
 	}
diff --git a/pages/events.js b/pages/events.js
index dcdbe64..fbfc464 100644
--- a/pages/events.js
+++ b/pages/events.js
@@ -11,11 +11,13 @@ import { reduxWrapper } from "../store";
 import Header from "./components/Header";
 import Footer from "./components/Footer";
 import Company from "./components/Company";
+import Manager from "./components/Manager";
 import InnerMenu from "./components/Events/InnerMenu";
 
 import NotificationMessage from "./components/Events/NotificationMessage";
 
 import { getFilteredEvents } from "../actions";
+import AccountLayout from "./components/Layout/Account";
 
 class EventsPage extends React.Component 
 {
@@ -85,108 +87,103 @@ class EventsPage extends React.Component
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
 				<Header {...this.props} />
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ flexDirection: "column" }}>
-									<h1 className="section_title">События</h1>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu { ...this.props }/>
-								<article>
-									<div className="contract_search">
-										<form onSubmit={ (event) => { event.preventDefault(); } }>
-											<div className="form_field full">
-												<input type="search" value={ search } placeholder="Поиск" onChange={ (event) => {
-													this._handle_onChange_search(event.target.value);
-												} }/>
-											</div>
-											<button className="button" disabled={ search !== "" ? false : true } onClick={ this._handle_onSearch }>Поиск</button>
-										</form>
-									</div>
-										{ events_loaded && (
-											<>
-												{ filtered !== undefined ? (
-													<>
-														{ filtered.length > 0 ? (
-															<ul className="list events-list">
-																{ filtered.map((event, index) => (
-																	<NotificationMessage event={ event } key={ index } { ...this.props }/>
-																)) }
-															</ul>
-														) : (
-															<p>Нет событий по выбранным условиям.</p>
-														) }
-													</>
-												) : (
-													<>
-														{ events.length > 0 ? (
-															<ul className="list events-list">
-																{ events.map((event, index) => (
-																	<NotificationMessage event={ event } key={ index } { ...this.props }/>
-																)) }
-															</ul>
-														) : (
-															<p>У Вас нет событий по договорам.</p>
-														) }
-													</>
-												)}
-											</>
-										) }
-										{/*}
-										<li className="new">
-											<p className="name">
-												<b>
-												Внимание! { events_loaded === true ? "events_loaded" : "!!!events_loaded" } Просрочена дата возврата СТС по договору:
-												ХХ.ХХ.ХХХХ
-												</b>
-											</p>
-											<p className="type">Важное</p>
-											<p className="date">10.01.2022</p>
-											<p className="action">
-												<a href="">Посмотрите порядок возврата СТС</a>&nbsp; или
-												&nbsp;<a href="">Загрузите скан СТС</a>
-											</p>
-										</li>
-										{*/}
-										{/*}
-										<li className="new">
-											<p className="name">
-												<b>
-												Внимание! Просрочена дата возврата СТС по договору:
-												ХХ.ХХ.ХХХХ
-												</b>
-											</p>
-											<p className="date">10.01.2022</p>
-											<p className="action">
-												<a href="">Посмотрите порядок возврата СТС</a>&nbsp; или
-												&nbsp;<a href="">Загрузите скан СТС</a>
-											</p>
-										</li>
-										{*/}
-										{/*}
-										<li className="new">
-											<p className="name">
-												Внимание! Осталось ХХ дней до пролонгации КАСКО по
-												договору №ХХХХ: ХХ.ХХ.ХХХХ. Не забудьте самостоятельно
-												продлить полис ОСАГО
-											</p>
-											<p className="date">10.01.2022</p>
-											<p className="action">
-												<a href="">Подробнее</a>
-											</p>
-										</li>
-										{*/}
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: "column" }}>
+							<h1 className="section_title">События</h1>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu { ...this.props }/>
+						<article>
+							<div className="contract_search">
+								<form onSubmit={ (event) => { event.preventDefault(); } }>
+									<div className="form_field full">
+										<input type="search" value={ search } placeholder="Поиск" onChange={ (event) => {
+											this._handle_onChange_search(event.target.value);
+										} }/>
+									</div>
+									<button className="button" disabled={ search !== "" ? false : true } onClick={ this._handle_onSearch }>Поиск</button>
+								</form>
+							</div>
+								{ events_loaded && (
+									<>
+										{ filtered !== undefined ? (
+											<>
+												{ filtered.length > 0 ? (
+													<ul className="list events-list">
+														{ filtered.map((event, index) => (
+															<NotificationMessage event={ event } key={ index } { ...this.props }/>
+														)) }
+													</ul>
+												) : (
+													<p>Нет событий по выбранным условиям.</p>
+												) }
+											</>
+										) : (
+											<>
+												{ events.length > 0 ? (
+													<ul className="list events-list">
+														{ events.map((event, index) => (
+															<NotificationMessage event={ event } key={ index } { ...this.props }/>
+														)) }
+													</ul>
+												) : (
+													<p>У Вас нет событий по договорам.</p>
+												) }
+											</>
+										)}
+									</>
+								) }
+								{/*}
+								<li className="new">
+									<p className="name">
+										<b>
+										Внимание! { events_loaded === true ? "events_loaded" : "!!!events_loaded" } Просрочена дата возврата СТС по договору:
+										ХХ.ХХ.ХХХХ
+										</b>
+									</p>
+									<p className="type">Важное</p>
+									<p className="date">10.01.2022</p>
+									<p className="action">
+										<a href="">Посмотрите порядок возврата СТС</a>&nbsp; или
+										&nbsp;<a href="">Загрузите скан СТС</a>
+									</p>
+								</li>
+								{*/}
+								{/*}
+								<li className="new">
+									<p className="name">
+										<b>
+										Внимание! Просрочена дата возврата СТС по договору:
+										ХХ.ХХ.ХХХХ
+										</b>
+									</p>
+									<p className="date">10.01.2022</p>
+									<p className="action">
+										<a href="">Посмотрите порядок возврата СТС</a>&nbsp; или
+										&nbsp;<a href="">Загрузите скан СТС</a>
+									</p>
+								</li>
+								{*/}
+								{/*}
+								<li className="new">
+									<p className="name">
+										Внимание! Осталось ХХ дней до пролонгации КАСКО по
+										договору №ХХХХ: ХХ.ХХ.ХХХХ. Не забудьте самостоятельно
+										продлить полис ОСАГО
+									</p>
+									<p className="date">10.01.2022</p>
+									<p className="action">
+										<a href="">Подробнее</a>
+									</p>
+								</li>
+								{*/}
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/index.js b/pages/index.js
index 3b962e7..ca08440 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -17,6 +17,7 @@ import Company from "./components/Company";
 import DateInput from './components/DatePicker';
 import Pagination from './components/Pagination';
 import Manager from "./components/Manager";
+import AccountLayout from "./components/Layout/Account";
 
 import AnnouncementsList from "./components/AnnouncementsList";
 
@@ -173,133 +174,123 @@ class IndexPage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="overflow">
-							<div className="container">
-								<div className="title_wrapper">
-									<div className="left">
-										<h1 className="section_title">Личный кабинет</h1>
-									</div>
-									<div className="right">
-										<Company company={ company } { ...this.props }/>
-									</div>
-								</div>
-								<AnnouncementsList />
-								<div className="contract_search">
-									<form onSubmit={ (event) => { event.preventDefault(); } }>
-										<div className="form_field">
-											<input type="search" value={ search } placeholder="Поиск" onChange={ (event) => {
-												this._handle_onChange_search(event.target.value);
-											} }/>
-										</div>
-										<div className="form_field">
-											{/*
-											<input type={ date_from_type } id="date_from" className="date_input" value="" placeholder="Дата договора от" onFocus={ () => this.setState({ date_from_type: "date" }) } onBlur={ () => { this.setState({ date_from_type: "text" }) } } onChange={ (date) => {
-												this._handle_onChange_date_from(date);
-											} }/>
-											<label htmlFor="date_from">Дата<br/>договора от</label>
-											*/}
-											<DateInput placeholder="Дата договора от" id={ "date_from" } onChange={ (date) => this.setState({ date_from: date }) }/>
-										</div>
-										<div className="form_field">
-											{/*<input type={ date_to_type } id="date_for" className="date_input" value="" placeholder="Дата договора по" onFocus={ () => this.setState({ date_from_type: "date" }) } onBlur={ () => { this.setState({ date_from_type: "text" }) } } onChange={ (date) => {
-												this._handle_onChange_date_to(date);
-											} }/>
-										<label htmlFor="date_for">Дата<br/>договора по</label>*/}
-											<DateInput placeholder="Дата договора по" id={ "date_to" } onChange={ (date) => this.setState({ date_to: date }) }/>
-										</div>
-										<button className="button" disabled={ search !== "" || date_from !== "" || date_to !== "" ? false : true } onClick={ this._handle_onSearch }>Поиск</button>
-									</form>
-								</div>
-								{ loading ? (
-									<div className="table_row table_header" style={{ minHeight: 450, display: "flex", justifyContent: "center", alignItems: "center" }}>
-										<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-									</div>
-								) : (
-									<div className="contract_table">
-										<div className="table_row table_header">
-											<div className={`table_cell caret ${ sort_number === "asc" ? "reverse" : "" }`} onClick={ this._handle_onChangeSort_number }>Номер договора</div>
-											<div className={`table_cell caret ${ sort_date === "asc" ? "reverse" : "" }`} onClick={ this._handle_onChangeSort_date }>Дата договора</div>
-											<div className="table_cell">Автомобиль</div>
-											<div className="table_cell">Гос.номер / VIN</div>
-											<div className={`table_cell caret ${ sort_status === "asc" ? "reverse" : "" }`} onClick={ this._handle_onChangeSort_status }>Статус</div>
-											<div className="table_cell">Следующий платеж</div>
-											<div className="table_cell">Дополнительные услуги</div>
-										</div>
-										{ contracts !== null && (
-											<>
-												{ contracts.length > 0 ? contracts.map((contract, index) => (
-													<Link href={`/contract/${ contract.number }/payments`} key={ index }>
-														<div className="table_row" key={ index } style={{ cursor: "pointer" }}>
-															<div className="table_cell"><a>{ contract.number }</a></div>
-															<div className="table_cell">{ moment(contract.date).format("DD.MM.YYYY") }</div>
-															<div className="table_cell">{ contract.car?.brand?.name } { contract.car?.model?.name }</div>
-															<div className="table_cell">
-																{ contract.car?.reg_number !== null ? contract.car?.reg_number : "Без рег. номера" }
-																<span>{ contract.car?.vin_number }</span>
-															</div>
-															<div className="table_cell">
-																<p className={ contract_status[contract.status] }>{ contract.status }</p>
-																{ contract.debt_leasing !== undefined && contract.debt_leasing !== null && parseFloat(contract.debt_leasing) > 0 && (
-																	<p className="contract_debt">
-																		<span>Задолжность:</span>
-																		{ numeral(contract.debt_leasing).format(' ., ') }&nbsp;₽
-																	</p>
-																) }
-																{ contract.debt_penalty_fee !== undefined && contract.debt_penalty_fee !== null && parseFloat(contract.debt_penalty_fee) > 0 && (
-																	<p className="contract_debt">
-																		<span>Пени:</span>
-																		{ numeral(contract.debt_penalty_fee).format(' ., ') }&nbsp;₽
-																	</p>
-																) }
-															</div>
-															<div className="table_cell">
-																{ contract.current_payment_date !== null ? (
-																	<>{ moment(contract.current_payment_date).format("DD.MM.YYYY") }<b className="price" style={{ whiteSpace: "nowrap" }}>{ numeral(contract.current_payment_amount).format(' ., ') }&nbsp;₽</b></>
-																) : "-" }
-															</div>
-															<div className="table_cell">
-																<div className="service_list">
-																	{ contract.telematics_exists && <i title="Телематика" data-additional-service="1" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#telematic`) } }></i> }
-																	{ contract.rat_exists && <i title="РАТ" data-additional-service="2" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#ratcard`) } }></i> }
-																	{ contract.gibddreg_exists && <i title="Регистрация в ГИБДД" data-additional-service="3" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#registration`) } }></i> }
-																	{ contract.fuelcard_exists && <i title="Топливные карты" data-additional-service="4" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#fuelcards`) } }></i> }
-																	{ contract.kasko_exists && <i title="КАСКО" data-additional-service="5" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
-																	{ contract.osago_exists && <i title="ОСАГО" data-additional-service="6" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
-																	{ contract.nsib_exists && <i title="НСИБ" data-additional-service="7" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
-																	{ contract.fingap_exists && <i title="FinGAP" data-additional-service="8" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
-																</div>
-															</div>
-														</div>
-													</Link>
-												)) : (
-													<div className="table_row">
-														<div className="table_cell">-</div>
-														<div className="table_cell">-</div>
-														<div className="table_cell">-</div>
-														<div className="table_cell">-</div>
-														<div className="table_cell">-</div>
-														<div className="table_cell">-</div>
-														<div className="table_cell">-</div>
-													</div>
-												) }
-											</>
-										) }
-									</div>
-								) }
-								{ !all && (
-									<Pagination page={ page } pages={ pages } onPage={ this._handle_onPage } onAll={ this._handle_onAll } all={ all } showAll={ true }/>
-								) }
-								
-								<Manager/>
-								
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left">
+							<h1 className="section_title">Личный кабинет</h1>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<div className="right">
+							<Company company={ company } { ...this.props }/>
+						</div>
+					</div>
+					<AnnouncementsList />
+					<div className="contract_search">
+						<form onSubmit={ (event) => { event.preventDefault(); } }>
+							<div className="form_field">
+								<input type="search" value={ search } placeholder="Поиск" onChange={ (event) => {
+									this._handle_onChange_search(event.target.value);
+								} }/>
+							</div>
+							<div className="form_field">
+								{/*
+								<input type={ date_from_type } id="date_from" className="date_input" value="" placeholder="Дата договора от" onFocus={ () => this.setState({ date_from_type: "date" }) } onBlur={ () => { this.setState({ date_from_type: "text" }) } } onChange={ (date) => {
+									this._handle_onChange_date_from(date);
+								} }/>
+								<label htmlFor="date_from">Дата<br/>договора от</label>
+								*/}
+								<DateInput placeholder="Дата договора от" id={ "date_from" } onChange={ (date) => this.setState({ date_from: date }) }/>
+							</div>
+							<div className="form_field">
+								{/*<input type={ date_to_type } id="date_for" className="date_input" value="" placeholder="Дата договора по" onFocus={ () => this.setState({ date_from_type: "date" }) } onBlur={ () => { this.setState({ date_from_type: "text" }) } } onChange={ (date) => {
+									this._handle_onChange_date_to(date);
+								} }/>
+							<label htmlFor="date_for">Дата<br/>договора по</label>*/}
+								<DateInput placeholder="Дата договора по" id={ "date_to" } onChange={ (date) => this.setState({ date_to: date }) }/>
+							</div>
+							<button className="button" disabled={ search !== "" || date_from !== "" || date_to !== "" ? false : true } onClick={ this._handle_onSearch }>Поиск</button>
+						</form>
+					</div>
+					{ loading ? (
+						<div className="table_row table_header" style={{ minHeight: 450, display: "flex", justifyContent: "center", alignItems: "center" }}>
+							<SpinnerCircular size={90} thickness={51} speed={100} color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
+						</div>
+					) : (
+						<div className="contract_table">
+							<div className="table_row table_header">
+								<div className={`table_cell caret ${ sort_number === "asc" ? "reverse" : "" }`} onClick={ this._handle_onChangeSort_number }>Номер договора</div>
+								<div className={`table_cell caret ${ sort_date === "asc" ? "reverse" : "" }`} onClick={ this._handle_onChangeSort_date }>Дата договора</div>
+								<div className="table_cell">Автомобиль</div>
+								<div className="table_cell">Гос.номер / VIN</div>
+								<div className={`table_cell caret ${ sort_status === "asc" ? "reverse" : "" }`} onClick={ this._handle_onChangeSort_status }>Статус</div>
+								<div className="table_cell">Следующий платеж</div>
+								<div className="table_cell">Дополнительные услуги</div>
+							</div>
+							{ contracts !== null && (
+								<>
+									{ contracts.length > 0 ? contracts.map((contract, index) => (
+										<Link href={`/contract/${ contract.number }/payments`} key={ index }>
+											<div className="table_row" key={ index } style={{ cursor: "pointer" }}>
+												<div className="table_cell"><a>{ contract.number }</a></div>
+												<div className="table_cell">{ moment(contract.date).format("DD.MM.YYYY") }</div>
+												<div className="table_cell">{ contract.car?.brand?.name } { contract.car?.model?.name }</div>
+												<div className="table_cell">
+													{ contract.car?.reg_number !== null ? contract.car?.reg_number : "Без рег. номера" }
+													<span>{ contract.car?.vin_number }</span>
+												</div>
+												<div className="table_cell">
+													<p className={ contract_status[contract.status] }>{ contract.status }</p>
+													{ contract.debt_leasing !== undefined && contract.debt_leasing !== null && parseFloat(contract.debt_leasing) > 0 && (
+														<p className="contract_debt">
+															<span>Задолжность:</span>
+															{ numeral(contract.debt_leasing).format(' ., ') }&nbsp;₽
+														</p>
+													) }
+													{ contract.debt_penalty_fee !== undefined && contract.debt_penalty_fee !== null && parseFloat(contract.debt_penalty_fee) > 0 && (
+														<p className="contract_debt">
+															<span>Пени:</span>
+															{ numeral(contract.debt_penalty_fee).format(' ., ') }&nbsp;₽
+														</p>
+													) }
+												</div>
+												<div className="table_cell">
+													{ contract.current_payment_date !== null ? (
+														<>{ moment(contract.current_payment_date).format("DD.MM.YYYY") }<b className="price" style={{ whiteSpace: "nowrap" }}>{ numeral(contract.current_payment_amount).format(' ., ') }&nbsp;₽</b></>
+													) : "-" }
+												</div>
+												<div className="table_cell">
+													<div className="service_list">
+														{ contract.telematics_exists && <i title="Телематика" data-additional-service="1" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#telematic`) } }></i> }
+														{ contract.rat_exists && <i title="РАТ" data-additional-service="2" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#ratcard`) } }></i> }
+														{ contract.gibddreg_exists && <i title="Регистрация в ГИБДД" data-additional-service="3" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#registration`) } }></i> }
+														{ contract.fuelcard_exists && <i title="Топливные карты" data-additional-service="4" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#fuelcards`) } }></i> }
+														{ contract.kasko_exists && <i title="КАСКО" data-additional-service="5" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
+														{ contract.osago_exists && <i title="ОСАГО" data-additional-service="6" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
+														{ contract.nsib_exists && <i title="НСИБ" data-additional-service="7" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
+														{ contract.fingap_exists && <i title="FinGAP" data-additional-service="8" onClick={ (event) => { event.stopPropagation(); event.preventDefault(); this._handle_onService(`/contract/${ contract.number }/services#insurance`) } }></i> }
+													</div>
+												</div>
+											</div>
+										</Link>
+									)) : (
+										<div className="table_row">
+											<div className="table_cell">-</div>
+											<div className="table_cell">-</div>
+											<div className="table_cell">-</div>
+											<div className="table_cell">-</div>
+											<div className="table_cell">-</div>
+											<div className="table_cell">-</div>
+											<div className="table_cell">-</div>
+										</div>
+									) }
+								</>
+							) }
+						</div>
+					) }
+					{ !all && (
+						<Pagination page={ page } pages={ pages } onPage={ this._handle_onPage } onAll={ this._handle_onAll } all={ all } showAll={ true }/>
+					) }
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		)
 	}
diff --git a/pages/settings/admin.js b/pages/settings/admin.js
index 03aa952..a47d8d1 100644
--- a/pages/settings/admin.js
+++ b/pages/settings/admin.js
@@ -18,6 +18,7 @@ import Pagination from '../components/Pagination';
 import Company from "../components/Company";
 
 import { getUsers, sendPhoneChangeNumber, sendPhoneChangeNumberSmsCode, setUserPhone } from '../../actions';
+import AccountLayout from "../components/Layout/Account";
 
 class Form extends React.Component
 {
@@ -196,116 +197,111 @@ class AdminPage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left">
-									<h1 className="section_title">Личный кабинет</h1>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left">
+							<h1 className="section_title">Личный кабинет</h1>
+						</div>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu { ...this.props }/>
+						<article>
+							<div className="settings_user_control">
+								<p>Настройки доступа к личному кабинету</p>
+								<div>
+									{ add || edit ? (
+										<button className="button button-blue" onClick={ this._handle_onSave }>Сохранить</button>
+									) : (
+										<>
+											<button className="button button-blue" onClick={ this._handle_onAdd }>Добавить пользователя</button>
+											<button className="button button-blue" onClick={ this._handle_onEdit }>Редактировать</button>
+										</>
+									) }
 								</div>
-								<Company { ...this.props }/>
 							</div>
-							<div className="aside_container about">
-								<InnerMenu { ...this.props }/>
-								<article>
-									<div className="settings_user_control">
-										<p>Настройки доступа к личному кабинету</p>
-										<div>
-											{ add || edit ? (
-												<button className="button button-blue" onClick={ this._handle_onSave }>Сохранить</button>
-											) : (
-												<>
-													<button className="button button-blue" onClick={ this._handle_onAdd }>Добавить пользователя</button>
-													<button className="button button-blue" onClick={ this._handle_onEdit }>Редактировать</button>
-												</>
-											) }
-										</div>
-									</div>
-									<div className="settings_table editable">
-										<div className="table_header table_row">
-											<div className="table_cell">ФИО пользователя</div>
-											<div className="table_cell">Почта</div>
-											<div className="table_cell">Роль</div>
-											<div className="table_cell">Доступные организации</div>
-											<div className="table_cell">Статус</div>
-											<div className="table_cell"></div>
-										</div>
-										{ users !== undefined && users !== null && users.map((entry, index) => 
-										{ 
-											if(entry.email === user.email)
-											{
-												return (
-													<div className="table_row" key={ index }>
-														<div className="table_cell" data-title="ФИО пользователя">{ entry.name } (Вы)</div>
-														<div className="table_cell" data-title="Почта">{ entry.email }</div>
-														<div className="table_cell" data-title="Роль">Администратор</div>
-														<div className="table_cell" data-title="Доступные организации">Все организации</div>
-														<div className="table_cell" data-title="Статус">Активен</div>
-														<div className="table_cell delete" style={{ position: 'relative' }}>
-														</div>
-													</div>
-												)
-											}
-											return null;
-										}) }
-										{ users !== undefined && users !== null && users.map((entry, index) => 
-										{ 
-											if(entry.email !== user.email)
-											{
-												return (
-													<div className="table_row" key={ index }>
-														<div className="table_cell" data-title="ФИО пользователя">{ entry.name }</div>
-														<div className="table_cell" data-title="Почта">{ entry.email }</div>
-														<div className="table_cell" data-title="Роль">Администратор</div>
-														<div className="table_cell" data-title="Доступные организации">{ entry.companies.map((company, c_index) => (
-															<p key={ c_index }>{ company.title }</p>
-														)) }</div>
-														<div className="table_cell" data-title="Статус">Активен</div>
-														<div className="table_cell delete" style={{ position: 'relative' }}>
-														</div>
-													</div>
-												)
-											}
-											return null;
-										}) }
-										{/*}
-										{ user !== undefined && user !== null && user.email !== undefined && user.email !== null && (
-											<div className="table_row">
-												<div className="table_cell" data-title="ФИО пользователя">{ `${ user.lastname } ${ user.name } ${ user.secondname }` }</div>
-												<div className="table_cell" data-title="Почта">{ user.email }</div>
+							<div className="settings_table editable">
+								<div className="table_header table_row">
+									<div className="table_cell">ФИО пользователя</div>
+									<div className="table_cell">Почта</div>
+									<div className="table_cell">Роль</div>
+									<div className="table_cell">Доступные организации</div>
+									<div className="table_cell">Статус</div>
+									<div className="table_cell"></div>
+								</div>
+								{ users !== undefined && users !== null && users.map((entry, index) => 
+								{ 
+									if(entry.email === user.email)
+									{
+										return (
+											<div className="table_row" key={ index }>
+												<div className="table_cell" data-title="ФИО пользователя">{ entry.name } (Вы)</div>
+												<div className="table_cell" data-title="Почта">{ entry.email }</div>
 												<div className="table_cell" data-title="Роль">Администратор</div>
 												<div className="table_cell" data-title="Доступные организации">Все организации</div>
 												<div className="table_cell" data-title="Статус">Активен</div>
 												<div className="table_cell delete" style={{ position: 'relative' }}>
 												</div>
 											</div>
-										) }
-										{*/}
-										{/*}
-										<div className="table_row">
-											<div className="table_cell" data-title="ФИО пользователя">Иванов Иван Иванович</div>
-											<div className="table_cell" data-title="Почта">iivanov@mail.com</div>
-											<div className="table_cell" data-title="Роль">Администратор</div>
-											<div className="table_cell" data-title="Доступные организации">Все организации</div>
-											<div className="table_cell" data-title="Статус">Активен</div>
-											<div className="table_cell delete" style={{ position: 'relative' }}>
-												<button className="delete_user" title="Удалить пользователя"></button>
+										)
+									}
+									return null;
+								}) }
+								{ users !== undefined && users !== null && users.map((entry, index) => 
+								{ 
+									if(entry.email !== user.email)
+									{
+										return (
+											<div className="table_row" key={ index }>
+												<div className="table_cell" data-title="ФИО пользователя">{ entry.name }</div>
+												<div className="table_cell" data-title="Почта">{ entry.email }</div>
+												<div className="table_cell" data-title="Роль">Администратор</div>
+												<div className="table_cell" data-title="Доступные организации">{ entry.companies.map((company, c_index) => (
+													<p key={ c_index }>{ company.title }</p>
+												)) }</div>
+												<div className="table_cell" data-title="Статус">Активен</div>
+												<div className="table_cell delete" style={{ position: 'relative' }}>
+												</div>
 											</div>
+										)
+									}
+									return null;
+								}) }
+								{/*}
+								{ user !== undefined && user !== null && user.email !== undefined && user.email !== null && (
+									<div className="table_row">
+										<div className="table_cell" data-title="ФИО пользователя">{ `${ user.lastname } ${ user.name } ${ user.secondname }` }</div>
+										<div className="table_cell" data-title="Почта">{ user.email }</div>
+										<div className="table_cell" data-title="Роль">Администратор</div>
+										<div className="table_cell" data-title="Доступные организации">Все организации</div>
+										<div className="table_cell" data-title="Статус">Активен</div>
+										<div className="table_cell delete" style={{ position: 'relative' }}>
 										</div>
-										{*/}
-										{ add && (
-											<Form companies={ companies }/>
-										) }
-										{/*}
-										{*/}
 									</div>
-								</article>
+								) }
+								{*/}
+								{/*}
+								<div className="table_row">
+									<div className="table_cell" data-title="ФИО пользователя">Иванов Иван Иванович</div>
+									<div className="table_cell" data-title="Почта">iivanov@mail.com</div>
+									<div className="table_cell" data-title="Роль">Администратор</div>
+									<div className="table_cell" data-title="Доступные организации">Все организации</div>
+									<div className="table_cell" data-title="Статус">Активен</div>
+									<div className="table_cell delete" style={{ position: 'relative' }}>
+										<button className="delete_user" title="Удалить пользователя"></button>
+									</div>
+								</div>
+								{*/}
+								{ add && (
+									<Form companies={ companies }/>
+								) }
+								{/*}
+								{*/}
 							</div>
-						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		)
 	}
diff --git a/pages/settings/password.js b/pages/settings/password.js
index 25c2ce9..673513a 100644
--- a/pages/settings/password.js
+++ b/pages/settings/password.js
@@ -17,6 +17,7 @@ import Pagination from '../components/Pagination';
 import Company from "../components/Company";
 
 import { sendNewPassword } from '../../actions';
+import AccountLayout from "../components/Layout/Account";
 
 class IndexPage extends React.Component 
 {
@@ -138,57 +139,52 @@ class IndexPage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left">
-									<h1 className="section_title">Смена пароля</h1>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu { ...this.props }/>
-								<article>
-									{ password_form_step === 1 && (
-										<div className={`login recovery`}>
-											<form onSubmit={ this._handle_onPasswordSubmit } className="newPass_form">
-												<p className="message full">Введите Ваш текущий пароль</p>
-												<div className="form_field">
-													<input type="password" name="password" value={ password } placeholder="Текущий пароль" onChange={ (event) => this._handle_onPasswordChange(event.target.value) } />
-												</div>
-												<p style={{ width: "100%" }}>{ password_error ? 'Ошибка: неверный пароль' : `\u00A0` }</p>
-												<p style={{ width: "100%" }} className="message"><br/></p>
-												<p style={{ width: "100%" }} className="message"><br/></p>
-												<p className="message full">Введите новый пароль и повторите новый пароль</p>
-												<div className="form_field">
-													<input type="password" name="new_password" value={ new_password } placeholder="Новый пароль" onChange={ (event) => this._handle_onNewPasswordChange(event.target.value) } />
-												</div>
-												<div className="form_field">
-													<input type="password" name="new_password_repeat" value={ new_password_repeat } placeholder="Новый пароль (повторите)" onChange={ (event) => this._handle_onNewPasswordRepeatChange(event.target.value) } />
-												</div>
-												<button type="submit" className="button button-blue" disabled={ new_password_submit_disabled }>
-													{ new_password_check_loading ? (
-														<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "4px" }}/>
-													) : "Изменить пароль" }
-												</button>
-											</form>
-											<p className="full">{ new_password_error ? 'Внимание: пароли не совпадают' : `\u00A0` }</p>
-											<p className="full">{ new_password.length < 6 ? 'Внимание: минимальная длина пароля - 6 символов' : `\u00A0` }</p>
-										</div>
-									) }
-									{ password_form_step === 2 && (
-										<div className={`login recovery`}>
-											<p className="message full">Ваш пароль был успешно изменен.</p>
-										</div>
-									) }
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left">
+							<h1 className="section_title">Смена пароля</h1>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu { ...this.props }/>
+						<article>
+							{ password_form_step === 1 && (
+								<div className={`login recovery`}>
+									<form onSubmit={ this._handle_onPasswordSubmit } className="newPass_form">
+										<p className="message full">Введите Ваш текущий пароль</p>
+										<div className="form_field">
+											<input type="password" name="password" value={ password } placeholder="Текущий пароль" onChange={ (event) => this._handle_onPasswordChange(event.target.value) } />
+										</div>
+										<p style={{ width: "100%" }}>{ password_error ? 'Ошибка: неверный пароль' : `\u00A0` }</p>
+										<p style={{ width: "100%" }} className="message"><br/></p>
+										<p style={{ width: "100%" }} className="message"><br/></p>
+										<p className="message full">Введите новый пароль и повторите новый пароль</p>
+										<div className="form_field">
+											<input type="password" name="new_password" value={ new_password } placeholder="Новый пароль" onChange={ (event) => this._handle_onNewPasswordChange(event.target.value) } />
+										</div>
+										<div className="form_field">
+											<input type="password" name="new_password_repeat" value={ new_password_repeat } placeholder="Новый пароль (повторите)" onChange={ (event) => this._handle_onNewPasswordRepeatChange(event.target.value) } />
+										</div>
+										<button type="submit" className="button button-blue" disabled={ new_password_submit_disabled }>
+											{ new_password_check_loading ? (
+												<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "4px" }}/>
+											) : "Изменить пароль" }
+										</button>
+									</form>
+									<p className="full">{ new_password_error ? 'Внимание: пароли не совпадают' : `\u00A0` }</p>
+									<p className="full">{ new_password.length < 6 ? 'Внимание: минимальная длина пароля - 6 символов' : `\u00A0` }</p>
+								</div>
+							) }
+							{ password_form_step === 2 && (
+								<div className={`login recovery`}>
+									<p className="message full">Ваш пароль был успешно изменен.</p>
+								</div>
+							) }
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		)
 	}
diff --git a/pages/settings/phone.js b/pages/settings/phone.js
index 36b79b1..60349f3 100644
--- a/pages/settings/phone.js
+++ b/pages/settings/phone.js
@@ -18,6 +18,7 @@ import Pagination from '../components/Pagination';
 import Company from "../components/Company";
 
 import { sendPhoneChangeNumber, sendPhoneChangeNumberSmsCode, setUserPhone } from '../../actions';
+import AccountLayout from "../components/Layout/Account";
 
 class IndexPage extends React.Component 
 {
@@ -165,80 +166,75 @@ class IndexPage extends React.Component
 					/>
 				</Head>
 				<Header { ...this.props }/>
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left">
-									<h1 className="section_title">Вход по номеру телефона</h1>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu { ...this.props }/>
-								<article>
-									{ phone_form_step !== 2 && phone_form_step !== 3 && (
-										<>
-											{ user.phone !== undefined && user.phone !== null && user.phone !== "" ? (
-												<p>Номер для авторизации <strong>+{ user.phone.replace(/[^0-9.]/g, '') }</strong>. Вы можете изменить номер телефона для авторизации.</p>
-											) : (
-												<p>У Вас отсутствует привязанный номер телефона. Вы можете добавить номер телефона для авторизации.</p>
-											) }
-										</>
-									) }
-									<p><br/></p>
-									<div className={`login recovery`}>
-										{ phone_form_step === 1 && (
-											<>
-												<form onSubmit={ this._handle_onPhoneSubmit }>
-													<div className="form_field">
-														<input type="text" name="phone" value={ phone } placeholder="Введите номер телефона, например +7 900 111 22 33" onChange={ (event) => this._handle_onPhoneChange(event.target.value) } required={ true }/>
-													</div>
-													<button type="submit" className="button button-blue" disabled={ phone_login_disabled }>
-														{ phone_check_loading ? (
-															<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "4px" }}/>
-														) : "Получить код" }
-													</button>
-												</form>
-												<p>{ phone_number_error ? 'Ошибка: нет аккаунта с таким номером телефона' : `\u00A0` }</p>
-												<p>{ phone_number_format_error ? 'Ошибка: номер должен начинаться на +7' : `\u00A0` }</p>
-											</>
-										) }
-										{ phone_form_step === 2 && (
-											<>
-												<p className="message">На номер <strong>+{ phone.replace(/[^0-9.]/g, '') }</strong> отправлен код подтверждения.</p>
-												<form onSubmit={ this._handle_onCodeSubmit }>
-													<div className="form_field">
-														<input type="text" name="phone_code" value={ phone_code } placeholder="Введите код из СМС" onChange={ (event) => this._handle_onPhoneCodeChange(event.target.value) } />
-													</div>
-													<button type="submit" className="button button-blue" disabled={ phone_code_submit_disabled }>
-														{ code_check_loading ? (
-															<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "4px" }}/>
-														) : "Отправить код" }
-													</button>
-												</form>
-												<div className="resend" style={{ justifyContent: "flex-start" }}>
-													{ timer !== 0 ? (
-														<p>Запросить код повторно можно через: { timer } { pluralize(timer, 'секунд', 'секунду', 'секунды', 'секунд') }</p>
-													) : (
-														<button className="button button-blue transparent" onClick={ (event) => this._handle_onResendCode(event) }>Запросить код повторно</button>
-													) }
-													{/* disabled={ phone_code_resend_disabled }*/}
-												</div>
-												<p>{ phone_sms_code_error ? 'Ошибка: Вы указали неверный код' : `\u00A0` }</p>
-											</>
-										) }
-										{ phone_form_step === 3 && (
-											<p className="message">Вы успешно привязали номер <strong>+{ phone.replace(/[^0-9.]/g, '') }</strong> к Вашей учетной записи.</p>
-										) }
-									</div>
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left">
+							<h1 className="section_title">Вход по номеру телефона</h1>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu { ...this.props }/>
+						<article>
+							{ phone_form_step !== 2 && phone_form_step !== 3 && (
+								<>
+									{ user.phone !== undefined && user.phone !== null && user.phone !== "" ? (
+										<p>Номер для авторизации <strong>+{ user.phone.replace(/[^0-9.]/g, '') }</strong>. Вы можете изменить номер телефона для авторизации.</p>
+									) : (
+										<p>У Вас отсутствует привязанный номер телефона. Вы можете добавить номер телефона для авторизации.</p>
+									) }
+								</>
+							) }
+							<p><br/></p>
+							<div className={`login recovery`}>
+								{ phone_form_step === 1 && (
+									<>
+										<form onSubmit={ this._handle_onPhoneSubmit }>
+											<div className="form_field">
+												<input type="text" name="phone" value={ phone } placeholder="Введите номер телефона, например +7 900 111 22 33" onChange={ (event) => this._handle_onPhoneChange(event.target.value) } required={ true }/>
+											</div>
+											<button type="submit" className="button button-blue" disabled={ phone_login_disabled }>
+												{ phone_check_loading ? (
+													<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "4px" }}/>
+												) : "Получить код" }
+											</button>
+										</form>
+										<p>{ phone_number_error ? 'Ошибка: нет аккаунта с таким номером телефона' : `\u00A0` }</p>
+										<p>{ phone_number_format_error ? 'Ошибка: номер должен начинаться на +7' : `\u00A0` }</p>
+									</>
+								) }
+								{ phone_form_step === 2 && (
+									<>
+										<p className="message">На номер <strong>+{ phone.replace(/[^0-9.]/g, '') }</strong> отправлен код подтверждения.</p>
+										<form onSubmit={ this._handle_onCodeSubmit }>
+											<div className="form_field">
+												<input type="text" name="phone_code" value={ phone_code } placeholder="Введите код из СМС" onChange={ (event) => this._handle_onPhoneCodeChange(event.target.value) } />
+											</div>
+											<button type="submit" className="button button-blue" disabled={ phone_code_submit_disabled }>
+												{ code_check_loading ? (
+													<SpinnerCircular size={24} thickness={100} speed={100} color="rgba(255, 255, 255, 1)" secondaryColor="rgba(255, 255, 255, 0.5)" style={{ marginTop: "4px" }}/>
+												) : "Отправить код" }
+											</button>
+										</form>
+										<div className="resend" style={{ justifyContent: "flex-start" }}>
+											{ timer !== 0 ? (
+												<p>Запросить код повторно можно через: { timer } { pluralize(timer, 'секунд', 'секунду', 'секунды', 'секунд') }</p>
+											) : (
+												<button className="button button-blue transparent" onClick={ (event) => this._handle_onResendCode(event) }>Запросить код повторно</button>
+											) }
+											{/* disabled={ phone_code_resend_disabled }*/}
+										</div>
+										<p>{ phone_sms_code_error ? 'Ошибка: Вы указали неверный код' : `\u00A0` }</p>
+									</>
+								) }
+								{ phone_form_step === 3 && (
+									<p className="message">Вы успешно привязали номер <strong>+{ phone.replace(/[^0-9.]/g, '') }</strong> к Вашей учетной записи.</p>
+								) }
+							</div>
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		)
 	}
diff --git a/pages/support/appeals.js b/pages/support/appeals.js
index eedaaaf..c96f759 100644
--- a/pages/support/appeals.js
+++ b/pages/support/appeals.js
@@ -20,6 +20,7 @@ import {
 	getFile,
 	setAppealsRead,
 } from "../../actions";
+import AccountLayout from "../components/Layout/Account";
 
 class SupportAppealsPage extends React.Component 
 {
@@ -86,124 +87,119 @@ class SupportAppealsPage extends React.Component
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
 				<Header { ...this.props } />
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ flexDirection: "column" }}>
-									<h1 className="section_title">Мои обращения</h1>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu { ...this.props } />
-								<article>
-									<div className="appeal_list">
-										{ appeals !== undefined && appeals !== null && appeals.list !== undefined && appeals.list !== null && (
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: "column" }}>
+							<h1 className="section_title">Мои обращения</h1>
+						</div>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu { ...this.props } />
+						<article>
+							<div className="appeal_list">
+								{ appeals !== undefined && appeals !== null && appeals.list !== undefined && appeals.list !== null && (
+									<>
+										{ appeals.list.length > 0 ? (
 											<>
-												{ appeals.list.length > 0 ? (
-													<>
-														{ appeals.list.map((appeal, index) => 
-														(
-															<div className="appeal_item" key={ index }>
-																<div className="item_header">
-																	<p>Номер обращения: <b>{ appeal.number } от { moment(appeal.created_date, "YYYY-MM-DD").format("DD.MM.YYYY") }</b></p>
-																	<p>Отвественный сотрудник ОРК: <b>{ appeal.owner }</b></p>
-																	{ appeal.contracts.length > 0 && (
-																		<p>Договор{ appeal.contracts.length > 1 && "ы" }: <b>{ appeal.contracts.map((contract, contract_index) => (<span key={ contract_index }>№ { contract }{ contract_index < appeal.contracts.length - 1 && ", " }</span>)) }</b></p>																		
-																	) }
-																	<div className="status" style={{ backgroundColor: status[appeal.status].color }}>{ status[appeal.status].title }</div>
-																</div>
-																<div className="item_body">
-																	<div className="item_text">
-																		<p><b>Тема запроса</b></p>
-																		<p>{ appeal.subject }</p>
-																	</div>
-																	<div className="item_text">
-																		<p><b>Ответ ОРК</b></p>
-																		<p>{ appeal.answer === "" ? "Без ответа" : appeal.answer }</p>
-																		{ appeal.documents.length > 0 && (
-																			<div className="dosc_list medium-icon">
-																				{ appeal.documents.map((document, document_index) => 
-																				(
-																					<div className="row" key={ document_index }>
-																						<p className="doc_name i-pdf extension" data-format={ document.doc_extension }>
-																							{ document.doc_name }
-																							<span>Скачать документ</span>
-																						</p>
-																					</div>
-																				)) }
-																			</div>
-																		) }
-																	</div>
-																</div>
-															</div>
-														)) }
-													</>
-												) : (
-													<p>У Вас пока нет обращений.</p>
-												) }
-											</>
-										)}
-									{/*}
-										<div className="appeal_item">
-											<div className="item_header">
-												<p>Номер обращения: <b>123 от 13.04.2022</b></p>
-												<p>Отвественный ОРК: <b>Иванов И.И.</b></p>
-												<p>Договор: <b>№2021_1655, №2021_1655</b></p>
-												<div className="status">Активное</div>
-											</div>
-											<div className="item_body">
-												<div className="item_text">
-													<p><b>Тема запроса</b></p>
-													<p>Текстовый контент</p>
-												</div>
-												<div className="item_text">
-													<p><b>Текст ответа ОРК</b></p>
-													<p>Текстовый контент</p>
-												</div>
-											</div>
-										</div>
-										<div className="appeal_item">
-											<div className="item_header">
-												<p>Номер обращения: <b>123 от 13.04.2022</b></p>
-												<p>Отвественный ОРК: <b>Иванов И.И.</b></p>
-												<p>Договор: <b>№2021_1655, №2021_1655</b></p>
-											</div>
-											<div className="item_body">
-												<div className="item_text">
-													<p><b>Тема запроса</b></p>
-													<p>Текстовый контент</p>
-												</div>
-												<div className="item_text">
-													<p><b>Текст ответа ОРК</b></p>
-													<p>Текстовый контент</p>
-													<div className="dosc_list medium-icon">
-														<div className="row">
-															<p className="doc_name i-pdf extension">
-																№2021_1655 от 20.04.2021
-																<span>2021_1655 от 20.04.2021</span>
-															</p>
+												{ appeals.list.map((appeal, index) => 
+												(
+													<div className="appeal_item" key={ index }>
+														<div className="item_header">
+															<p>Номер обращения: <b>{ appeal.number } от { moment(appeal.created_date, "YYYY-MM-DD").format("DD.MM.YYYY") }</b></p>
+															<p>Отвественный сотрудник ОРК: <b>{ appeal.owner }</b></p>
+															{ appeal.contracts.length > 0 && (
+																<p>Договор{ appeal.contracts.length > 1 && "ы" }: <b>{ appeal.contracts.map((contract, contract_index) => (<span key={ contract_index }>№ { contract }{ contract_index < appeal.contracts.length - 1 && ", " }</span>)) }</b></p>																		
+															) }
+															<div className="status" style={{ backgroundColor: status[appeal.status].color }}>{ status[appeal.status].title }</div>
 														</div>
-														<div className="row">
-															<p className="doc_name i-pdf extension">
-																№2021_1655 от 20.04.2021
-																<span>2021_1655 от 20.04.2021</span>
-															</p>
+														<div className="item_body">
+															<div className="item_text">
+																<p><b>Тема запроса</b></p>
+																<p>{ appeal.subject }</p>
+															</div>
+															<div className="item_text">
+																<p><b>Ответ ОРК</b></p>
+																<p>{ appeal.answer === "" ? "Без ответа" : appeal.answer }</p>
+																{ appeal.documents.length > 0 && (
+																	<div className="dosc_list medium-icon">
+																		{ appeal.documents.map((document, document_index) => 
+																		(
+																			<div className="row" key={ document_index }>
+																				<p className="doc_name i-pdf extension" data-format={ document.doc_extension }>
+																					{ document.doc_name }
+																					<span>Скачать документ</span>
+																				</p>
+																			</div>
+																		)) }
+																	</div>
+																) }
+															</div>
 														</div>
 													</div>
+												)) }
+											</>
+										) : (
+											<p>У Вас пока нет обращений.</p>
+										) }
+									</>
+								)}
+							{/*}
+								<div className="appeal_item">
+									<div className="item_header">
+										<p>Номер обращения: <b>123 от 13.04.2022</b></p>
+										<p>Отвественный ОРК: <b>Иванов И.И.</b></p>
+										<p>Договор: <b>№2021_1655, №2021_1655</b></p>
+										<div className="status">Активное</div>
+									</div>
+									<div className="item_body">
+										<div className="item_text">
+											<p><b>Тема запроса</b></p>
+											<p>Текстовый контент</p>
+										</div>
+										<div className="item_text">
+											<p><b>Текст ответа ОРК</b></p>
+											<p>Текстовый контент</p>
+										</div>
+									</div>
+								</div>
+								<div className="appeal_item">
+									<div className="item_header">
+										<p>Номер обращения: <b>123 от 13.04.2022</b></p>
+										<p>Отвественный ОРК: <b>Иванов И.И.</b></p>
+										<p>Договор: <b>№2021_1655, №2021_1655</b></p>
+									</div>
+									<div className="item_body">
+										<div className="item_text">
+											<p><b>Тема запроса</b></p>
+											<p>Текстовый контент</p>
+										</div>
+										<div className="item_text">
+											<p><b>Текст ответа ОРК</b></p>
+											<p>Текстовый контент</p>
+											<div className="dosc_list medium-icon">
+												<div className="row">
+													<p className="doc_name i-pdf extension">
+														№2021_1655 от 20.04.2021
+														<span>2021_1655 от 20.04.2021</span>
+													</p>
+												</div>
+												<div className="row">
+													<p className="doc_name i-pdf extension">
+														№2021_1655 от 20.04.2021
+														<span>2021_1655 от 20.04.2021</span>
+													</p>
 												</div>
 											</div>
 										</div>
-									{*/}
 									</div>
-								</article>
+								</div>
+							{*/}
 							</div>
-						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/support/index.js b/pages/support/index.js
index be89291..42ea6cb 100644
--- a/pages/support/index.js
+++ b/pages/support/index.js
@@ -16,6 +16,7 @@ import InnerMenu from "./components/InnerMenu";
 import {
 	getSupportThemes,
 } from "../../actions";
+import AccountLayout from "../components/Layout/Account";
 
 class ContractPage extends React.Component 
 {
@@ -125,100 +126,95 @@ class ContractPage extends React.Component
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
 				<Header { ...this.props } />
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ flexDirection: "column" }}>
-									<h1 className="section_title">Обращения</h1>
-								</div>
-								<Company { ...this.props }/>
-							</div>
-							<div className="aside_container about">
-								<InnerMenu { ...this.props } />
-								<article>
-									{ loading ? (
-										<div className="container" style={{ display: "flex", alignItems: "center", justifyContent: "center", }}>
-											<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-										</div>									
-									) : (
-										<>
-											<div className="contract_search">
-												<form onSubmit={(event) => { event.preventDefault(); }}>
-													<div className="form_field full">
-														<input type="search" value={ query } placeholder="Поиск" onChange={(event) => { this._handle_onChangeSearchQuery(event.target.value);} }
-														/>
-													</div>
-													<button className="button" disabled={ query !== "" ? false : true } onClick={ this._handle_onSearch }>
-														Поиск
-													</button>
-												</form>
-											</div>
-											<div className="list faq-list">
-												{ themes !== undefined && themes !== null && themes.map((theme) => 
-												(
-													<div className="faq_item" key={ `theme_${ theme.id }` }>
-														<p className="item_title">{ theme.name }</p>
-														<div className="dropdown_blocks_list">
-															{ theme.questions.map((question) => 
-															(
-																<div ref={ this.question_refs[question.id] } className={ `dropdown_block ${ question.id === question_selected && "open" }` } key={ `question_${ question.id }` } onClick={ () => this._handle_onQuestion(question.id) }>
-																	<div className={ `block_header` }>
-																		<p>{ question.title }</p>
-																		<button></button>
-																	</div>
-																	<div className="block_body" style={{ paddingBottom: "20px" }}>
-																		<div className="column full">
-																			<div className="column_text_block">
-																				<p><b>Процедура</b></p>
-																				<p dangerouslySetInnerHTML={{ __html: question.answer }}/>
-																			</div>
-																			{ question.documents !== null && (
-																				<div className="column_text_block">
-																					<p><b>Документы</b></p>
-																					<p dangerouslySetInnerHTML={{ __html: question.documents }}/>
-																				</div>
-																			) }
-																			{ question.templates !== null && (
-																				<div className="column_text_block">
-																					<p><b>Шаблоны документов</b></p>
-																					<div className="dosc_list medium-icon">
-																						{ question.templates.map((template, index) => 
-																						(
-																							<div className="row" key={ `template_${ index }` }>
-																								<p className="doc_name i-pdf extension" data-format={ template.extension }>{ template.filename }</p>
-																							</div>
-																						)) }
-																					</div>
-																				</div>
-																			) }
-																			<button className="button button-blue" onClick={ () => this._handle_onRequest(question.id) }>Создать обращение</button>
-																		</div>
-																	</div>
-																</div>
-															)) }
-														</div>
-													</div>
-												)) }
-											</div>
-											{/* Результат поиска */}
-											{ searched !== undefined && searched !== null && searched.map((question) => (
-												<div className="search_list" key={ `searched_${ question.id }` }>
-													<div className="search_item">
-														<p className="item_title">{ question.theme } / { question.name }</p>
-														<p>К каждой теме свободное <mark>html поле для миниинструкции</mark> (со ссылками на формы документов и документы). Привязка к теме обращения в CRM</p>
-													</div>
-												</div>
-											)) }
-										</>
-									) }
-								</article>
-							</div>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ flexDirection: "column" }}>
+							<h1 className="section_title">Обращения</h1>
 						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						<InnerMenu { ...this.props } />
+						<article>
+							{ loading ? (
+								<div className="container" style={{ display: "flex", alignItems: "center", justifyContent: "center", }}>
+									<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
+								</div>									
+							) : (
+								<>
+									<div className="contract_search">
+										<form onSubmit={(event) => { event.preventDefault(); }}>
+											<div className="form_field full">
+												<input type="search" value={ query } placeholder="Поиск" onChange={(event) => { this._handle_onChangeSearchQuery(event.target.value);} }
+												/>
+											</div>
+											<button className="button" disabled={ query !== "" ? false : true } onClick={ this._handle_onSearch }>
+												Поиск
+											</button>
+										</form>
+									</div>
+									<div className="list faq-list">
+										{ themes !== undefined && themes !== null && themes.map((theme) => 
+										(
+											<div className="faq_item" key={ `theme_${ theme.id }` }>
+												<p className="item_title">{ theme.name }</p>
+												<div className="dropdown_blocks_list">
+													{ theme.questions.map((question) => 
+													(
+														<div ref={ this.question_refs[question.id] } className={ `dropdown_block ${ question.id === question_selected && "open" }` } key={ `question_${ question.id }` } onClick={ () => this._handle_onQuestion(question.id) }>
+															<div className={ `block_header` }>
+																<p>{ question.title }</p>
+																<button></button>
+															</div>
+															<div className="block_body" style={{ paddingBottom: "20px" }}>
+																<div className="column full">
+																	<div className="column_text_block">
+																		<p><b>Процедура</b></p>
+																		<p dangerouslySetInnerHTML={{ __html: question.answer }}/>
+																	</div>
+																	{ question.documents !== null && (
+																		<div className="column_text_block">
+																			<p><b>Документы</b></p>
+																			<p dangerouslySetInnerHTML={{ __html: question.documents }}/>
+																		</div>
+																	) }
+																	{ question.templates !== null && (
+																		<div className="column_text_block">
+																			<p><b>Шаблоны документов</b></p>
+																			<div className="dosc_list medium-icon">
+																				{ question.templates.map((template, index) => 
+																				(
+																					<div className="row" key={ `template_${ index }` }>
+																						<p className="doc_name i-pdf extension" data-format={ template.extension }>{ template.filename }</p>
+																					</div>
+																				)) }
+																			</div>
+																		</div>
+																	) }
+																	<button className="button button-blue" onClick={ () => this._handle_onRequest(question.id) }>Создать обращение</button>
+																</div>
+															</div>
+														</div>
+													)) }
+												</div>
+											</div>
+										)) }
+									</div>
+									{/* Результат поиска */}
+									{ searched !== undefined && searched !== null && searched.map((question) => (
+										<div className="search_list" key={ `searched_${ question.id }` }>
+											<div className="search_item">
+												<p className="item_title">{ question.theme } / { question.name }</p>
+												<p>К каждой теме свободное <mark>html поле для миниинструкции</mark> (со ссылками на формы документов и документы). Привязка к теме обращения в CRM</p>
+											</div>
+										</div>
+									)) }
+								</>
+							) }
+						</article>
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}
diff --git a/pages/support/request.js b/pages/support/request.js
index 1580bbc..a134f84 100644
--- a/pages/support/request.js
+++ b/pages/support/request.js
@@ -23,6 +23,7 @@ import {
 	sendNewAppeal,
 	sendAppealAttachments
 } from "../../actions";
+import AccountLayout from "../components/Layout/Account";
 
 class TemplateFile extends React.Component
 {
@@ -356,85 +357,80 @@ class SupportRequestPage extends React.Component
 					<meta name="description" content="ЛК Эволюция автолизинга" />
 				</Head>
 				<Header { ...this.props } />
-				<main>
-					<section>
-						<div className="clear"></div>
-						<div className="container">
-							<div className="title_wrapper">
-								<div className="left" style={{ alignItems: "center", flexWrap: "wrap" }}>
-									<button className="back" onClick={ this._handle_onBack }>Назад</button>
-									<h1 className="section_title">Новое обращение</h1>
-								</div>
-								<Company { ...this.props }/>
+				<AccountLayout>
+					<div className="title_wrapper">
+						<div className="left" style={{ alignItems: "center", flexWrap: "wrap" }}>
+							<button className="back" onClick={ this._handle_onBack }>Назад</button>
+							<h1 className="section_title">Новое обращение</h1>
+						</div>
+						<Company { ...this.props }/>
+					</div>
+					<div className="aside_container about">
+						{ loading ? (
+							<div className="container" style={{ display: "flex", alignItems: "center", justifyContent: "center", }}>
+								<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
 							</div>
-							<div className="aside_container about">
-								{ loading ? (
-									<div className="container" style={{ display: "flex", alignItems: "center", justifyContent: "center", }}>
-										<SpinnerCircular size={ 90 } thickness={ 51 } speed={ 100 } color="rgba(28, 1, 169, 1)" secondaryColor="rgba(236, 239, 244, 1)" />
-									</div>
+						) : (
+							<>
+								{ success ? (
+									<SuccessMessage/>
 								) : (
-									<>
-										{ success ? (
-											<SuccessMessage/>
-										) : (
-											<article className="full">
-												<div className="new_appeal">
-													<div className="column">
-														<div className="dropdown_blocks_list appeal_list visible">
-															{ themes !== undefined && themes !== null && themes.map((theme, theme_index) => 
-															(
-																<React.Fragment key={ `theme_${ theme_index }` } >
-																	<div className={ `appeal_item dropdown_block ${ theme_index === opened_theme && "open" }` } style={ theme_index === opened_theme ? { backgroundColor: "unset"} : {} } onClick={ () => this._handle_onChangeTheme(theme_index) }>
-																		<div className="block_header">
-																			<p style={{ fontWeight: "bold" }}>{ theme.name }</p>
-																			<button className="rotate"></button>
-																		</div>
-																	</div>
-																	{ theme_index === opened_theme && theme.questions.map((question, question_index) => (
-																		<div key={ `question_${ question_index }` } className={ `appeal_item dropdown_block ${ question_index === opened_question && "open" }` } style={{ paddingLeft: "20px" }} onClick={ () => this.setState({ opened_question: question_index }) }>
-																			<div className="block_header">
-																				<p>{ question.title }</p>
-																				<button className="rotate"></button>
-																			</div>
-																		</div>	
-																	) )}
-																</React.Fragment>
-															)) }
-														</div>
-													</div>
-													{ themes !== undefined && themes !== null && (
-														<div className="column">
-															<div className="column_text_block">
-																<p><b>Процедура</b></p>
-																<p dangerouslySetInnerHTML={{ __html: procedure.answer }}/>
+									<article className="full">
+										<div className="new_appeal">
+											<div className="column">
+												<div className="dropdown_blocks_list appeal_list visible">
+													{ themes !== undefined && themes !== null && themes.map((theme, theme_index) => 
+													(
+														<React.Fragment key={ `theme_${ theme_index }` } >
+															<div className={ `appeal_item dropdown_block ${ theme_index === opened_theme && "open" }` } style={ theme_index === opened_theme ? { backgroundColor: "unset"} : {} } onClick={ () => this._handle_onChangeTheme(theme_index) }>
+																<div className="block_header">
+																	<p style={{ fontWeight: "bold" }}>{ theme.name }</p>
+																	<button className="rotate"></button>
+																</div>
 															</div>
-															{ procedure.documents !== null && (
-																<div className="column_text_block">
-																	<p><b>Документы</b></p>
-																	<p dangerouslySetInnerHTML={{ __html: procedure.documents }}/>
-																</div>
-															) }
-															{ procedure.templates !== null && (
-																<div className="column_text_block">
-																	<p><b>Документы</b></p>
-																	<div className="dosc_list"> {/* medium-icon */}
-																		{ procedure.templates.map((template, index) => (<TemplateFile key={ `template_${ index }` } template={ template } />)) }
+															{ theme_index === opened_theme && theme.questions.map((question, question_index) => (
+																<div key={ `question_${ question_index }` } className={ `appeal_item dropdown_block ${ question_index === opened_question && "open" }` } style={{ paddingLeft: "20px" }} onClick={ () => this.setState({ opened_question: question_index }) }>
+																	<div className="block_header">
+																		<p>{ question.title }</p>
+																		<button className="rotate"></button>
 																	</div>
-																</div>
-															) }
-															{ this._renderForm() }
+																</div>	
+															) )}
+														</React.Fragment>
+													)) }
+												</div>
+											</div>
+											{ themes !== undefined && themes !== null && (
+												<div className="column">
+													<div className="column_text_block">
+														<p><b>Процедура</b></p>
+														<p dangerouslySetInnerHTML={{ __html: procedure.answer }}/>
+													</div>
+													{ procedure.documents !== null && (
+														<div className="column_text_block">
+															<p><b>Документы</b></p>
+															<p dangerouslySetInnerHTML={{ __html: procedure.documents }}/>
 														</div>
 													) }
+													{ procedure.templates !== null && (
+														<div className="column_text_block">
+															<p><b>Документы</b></p>
+															<div className="dosc_list"> {/* medium-icon */}
+																{ procedure.templates.map((template, index) => (<TemplateFile key={ `template_${ index }` } template={ template } />)) }
+															</div>
+														</div>
+													) }
+													{ this._renderForm() }
 												</div>
-											</article>
-										) }
-									</>
+											) }
+										</div>
+									</article>
 								) }
-							</div>
-						</div>
-					</section>
-				</main>
-				<Footer authenticated={ true }/>
+							</>
+						) }
+					</div>
+				</AccountLayout>
+				<Footer/>
 			</React.Fragment>
 		);
 	}