/* @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap'); */

@font-face {
	font-family: 'Quicksand Light';
	src: url('fonts/Quicksand.ttf') format('truetype');
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: 'Fifaks';
	src: url('fonts/Robo.ttf') format('truetype');
	font-style: normal;
	font-weight: normal;
}

/* ======== ПЕРЕМЕННЫЕ ======== */
:root {
	--header-height: 4rem;

	/* ЦВЕТА */
	/* --hue: 221;
	--first-color: hsl(var(--hue), 24%, 32%);
	--first-color-alt: hsl(var(--hue), 24%, 28%);
	--first-color-light: hsl(var(--hue), 24%, 66%);
	--first-color-lighten: hsl(var(--hue), 24%, 92%);
	--title-color: hsl(var(--hue), 4%, 15%);
	--text-color: hsl(var(--hue), 4%, 35%);
	--text-color-light: hsl(var(--hue), 4%, 55%);
	--text-color-super-light: hsla(var(--hue), 4%, 35%, 0.5);
	--body-color: hsl(var(--hue), 0%, 100%);
	--container-color: #fff;
	--mdgt-green: rgb(2, 128, 1); */

	--hue: 221;
	--first-color: hsl(107, 68%, 16%);

	--first-color-lighten: hsla(212, 11%, 50%, 0.2);
	--title-color: hsl(210, 2%, 18%);
	--text-color: hsl(212, 11%, 23%);
	--text-color-super-light: hsl(212, 11%, 33%);
	--body-color: hsl(var(--hue), 0%, 100%);
	--container-color: #fff;
	--mdgt-green: rgb(2, 128, 1);
	--brown_logo: #897460;
	--beige_logo: #d3a462;
	--green_logo: 	#73893d;
	--green_logo_hover: #596a2f;
	--green_logo_shadow: #90a165;
	--green_logo_form: #c7d0b2;


	/* ШРИФТЫ */
	/* .5 rem = 8px; 1rem = 16px */
	--body-font: 'Quicksand Light', sans-serif;
	--big-font-size: 2rem;
	--h1-font-size: 1.5rem;
	--h2-font-size: 1.25rem;
	--h3-font-size: 1rem;
	--normal-font-size: 0.938rem;
	--small-font-size: 0.813rem;
	--smaller-font-size: 0.75rem;

	--report-main-font-size: 1rem;
	--report-big-font-size: 2rem;
	--report-medium-font-size: 1.15rem;
	--report-smaller-font-size: 0.85rem;

	--font-lighter: 500;
	--font-base: 600;
	--font-medium: 700;
	--font-semi-bold: 800;

	/* ОТСТУПЫ */
	--mb-0-5: 0.5rem;
	--mb-0-75: 0.75rem;
	--mb-1: 1rem;
	--mb-1-5: 1.5rem;
	--mb-2: 2rem;
	--mb-2-5: 2.5rem;

	/* ПОЛОЖЕНИЯ */

	--z-tooltip: 10;
	--z-fixed: 100;
}

/* АДАПТИВНЫЕ РАЗМЕРЫ */

@media screen and (min-width: 968px) {
	:root {
		--big-font-size: 3.5rem;
		--h1-font-size: 2.25rem;
		--h2-font-size: 1.5rem;
		--h3-font-size: 1.25;
		--normal-font-size: 1rem;
		--small-font-size: 0.875rem;
		--smaller-font-size: 0.813rem;
	}
}

/* ======== ОСНОВНЫЕ ПАРАМЕТРЫ ======== */

*,
*::before,
*::after {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}

html,
body {
	height: 100%;
}

body,
button,
input,
textarea {
	font-family: var(--body-font);
	font-size: var(--normal-font-size);
	font-weight: var(--font-base);
}

body {
	/* margin: var(--header-height) 0 0 0; */
	margin: 0;
	padding: var(--header-height) 0 0 0;
	background-color: var(--body-color);
	color: var(--text-color);
}

button {
	cursor: pointer;
	border: none;
	outline: none;
}

h1,
h2,
h3 {
	color: var(--title-color);
	font-weight: var(--font-semi-bold);
	line-height: initial;
}

h1 {
	font-size: var(--h1-font-size);
}

h2 {
	font-size: var(--h2-font-size);
	list-style: none;
}

h3 {
	font-size: var(--h3-font-size);
}

a {
	text-decoration: none;
	outline: none;
}

p {
	display: block;
	margin: 0;
	padding: 0;
}

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

/* Модальное окно */
.itd_play {
	cursor: pointer;
	transition: all 0.2s ease;
}

/* ======== ПОВТОРЯЮЩИЕСЯ ЭЛЕМЕНТЫ ======== */

.container-mdgt {
	max-width: 968px;
	margin-left: var(--mb-1-5);
	margin-right: var(--mb-1-5);
}

@media screen and (max-width: 968px) {
	.container-mdgt {
		max-width: 100vw;
	}
}

.container-mdgt > .row {
	row-gap: 1.5rem;
	justify-content: center;
}

.wrapper {
	display: flex;
	flex-direction: column;
	height: 100%;

	align-items: center;
}

.grid {
	display: grid;
}

/* ======== НАВИГАЦИЯ ======== */

/* весь блок навигации (по сути header) */
.navbar-mdgt {
	width: 100%;
	background-color: var(--body-color);
	position: fixed;

	top: 0;
	left: 0;
	z-index: var(--z-fixed);

	transition: 0.4s;
	box-shadow: 0 1px 4px hsla(var(--hue), 4%, 15%, 0.1);
}

/* Сюда помещается весь контент хедера включая логотип и значки */
.container-fluid-mdgt {
	height: var(--header-height);
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/* логотип */
.navbar-brand {
	color: var(--title-color);
	white-space: nowrap;
	min-width: fit-content;
}

/* сначала мобильная версия */

@media screen and (max-width: 968px) {
	/* оболочка для создания затемненной части */
	.navbar-collapse-wrapper {
		background-color: hsla(var(--hue), 24%, 15%, 0.5);
		position: fixed;
		top: 0;
		width: 100%;
		height: 100%;
		/* right: 0; */
		right: -100%;
		z-index: calc(var(--z-fixed) - 1);
		overflow-y: auto;
	}

	/* сам список ссылок + кнопка "закрыть" */
	.navbar-collapse {
		position: absolute;
		background-color: var(--container-color);
		width: 50%;
		height: 100%;
		/* top: 0; */
		/* right: 0; */
		right: -100%;
		box-shadow: -2px 0 4px hsla(var(--hue), 24%, 15%, 0.1);
		padding: 4rem 0 0 3rem;
		border-radius: 1rem 0 0 1rem;
		transition: 0.3s;
		z-index: var(--z-fixed);
		overflow: auto;
	}

	.nav-link:last-child {
		margin-bottom: 1.5rem;
	}
}

/* далее свойства которые будут отменяться по мере необходимости для больших экранов */

.navbar-nav {
	padding: 5px, 0;
}

.navbar-brand {
	display: inline-flex;
	align-items: center;
	column-gap: 0.25rem;

	font-family: 'Fifaks', sans-serif;
}

.navbar-brand:hover {
	color: var(--green_logo);
}

.navbar-brand__icon {
	width: auto;
	height: 60px;
}

.navbar-brand__line {
	display: inline-block;
	width: 0.3px;
	height: 2rem;
	border-radius: 2rem;
	background-color: var(--text-color-super-light);
	/* box-shadow: 1px 1px 1px 1px var(--text-color-super-light); */
}

.navbar-brand__title-sub {
	font-size: var(--smaller-font-size);
	font-weight: var(--font-lighter);
}

.nav__toggle,
.nav__close {
	color: var(--title-color);
}

/* открыть */
.nav__toggle {
	display: inline-flex;
	font-size: 1.15rem;
	cursor: pointer;
}

/* закрыть */
.nav__close {
	font-size: 1.5rem;
	position: absolute;
	top: 1rem;
	right: 1.25rem;
	cursor: pointer;
}

/* ссылки */
.navbar-nav {
	display: flex;
	flex-direction: column;
	row-gap: 1.5rem;

	flex-wrap: wrap;
}

.nav-link {
	color: var(--title-color);
	font-weight: var(--font-medium);
}
.nav-link:hover {
	color: var(--green_logo);
}

/* КЛАССЫ ОТКРЫТИЯ-ЗАКРЫТИЯ МЕНЮ */

.navbar-collapse-wrapper.navbar-collapse-wrapper-show,
.navbar-collapse.navbar-collapse-show {
	right: 0;
}

.body.body-hidden {
	touch-action: none;
	-webkit-overflow-scrolling: none;
	overflow: hidden;
	overscroll-behavior: none;
}

/* ======== ТЕЛО ======== */
.content__container {
	margin: 0;
	padding: 0 1.5rem;
	display: flex;
	flex: 1 0 auto;
	flex-direction: column;
	padding-top: 1.2rem;
	align-items: center;
}

.container__title {
	align-self: center;
	margin-bottom: 1.25rem;
	white-space: nowrap;
}

.container_contact {
	width: 100%;
}

.text-start_check{
	width: auto;
    height: 17px
}

.text-start_close{
	width: auto;
    height: 13px
}

/* ======== ФУТЕР ======== */
.footer__container {
	flex: 0 0 auto;
	display: flex;

	row-gap: 0.5rem;

	flex-direction: column;

	align-items: center;
	justify-content: center;

	padding-top: 2rem;
	/* height: var(--header-height); */

	margin-top: 2.5rem;

	background-color: var(--first-color-lighten);

	width: 100%;

	box-shadow: 0 -1px 4px hsla(var(--hue), 4%, 15%, 0.1);
}

.footer__container .copy {
	padding-bottom: 1rem;
	text-align: center;
}

.footer__logo {
	display: flex;
	align-items: baseline;
	justify-content: center;

	/* background-color: var(--first-color-lighten); */

	border-top: 1px solid var(--first-color-lighten);
	/* box-shadow: 0 -1px 4px hsla(212, 4%, 15%, 0.1); */
	padding: 0.5rem;

	width: 100%;
	column-gap: 0.25rem;
}

.text-muted_mdgt {
	white-space: nowrap;
	color: var(--text-color-super-light);
	opacity: 0.9;
}

.footer__img {
	width: 50px;
	height: 50px;
}

/* ======== БРЕЙКПОИНТЫ ДЛЯ РАЗНЫХ РАЗМЕРОВ ЭКРАНОВ ======== */
@media screen and (min-width: 969px) {
	body {
		/* margin: calc(var(--header-height) + 1.5rem) 0 0 0; */
		padding: calc(var(--header-height) + 1.5rem) 0 0 0;
	}

	.container-mdgt {
		margin-left: auto;
		margin-right: auto;
	}

	.content__container {
		padding-right: 2rem;
		padding-left: 2rem;
	}

	.container-fluid-mdgt {
		height: calc(var(--header-height) + 1.5rem);
		column-gap: 3rem;
		justify-content: flex-start;
	}

	.nav__toggle,
	.nav__close {
		display: none;
	}

	.navbar-nav {
		flex-direction: row;
		column-gap: 3rem;
	}

	.navbar-collapse-wrapper,
	.navbar-collapse {
		margin-left: 0;
	}
	/* ========== Шапка для личного кабинета ==========*/
	/* 
	.navbar-collapse-personal{
		width: 100%;
	}

	.navbar-nav-personal{
		width: 100%;
		justify-content: space-between;
	}
	.navbar-collapse-wrapper-personal{
		width: 100%;
	}

	.nav-link.nav-link-personal{
		padding-right: 2rem;
	}	 */
}

/* ============== БЛОК КОНТАКТОВ ============== */

.contacts__header {
	/* font-size: 1.5rem; */
	display: inline-flex;
	align-items: center;
	column-gap: 0.25rem;

	color: var(--title-color);
}

.contacts__link:hover {
	color: var(--green_logo);
}

.contacts__description {
	color: var(--text-color-super-light);
	max-width: 200px;
}

.contacts__double-contact {
	display: flex;
	flex-direction: column;
	row-gap: 1.5rem;
}

.contacts__double-contact div {
	display: flex;
    flex-direction: column;
    align-items: center;
}

.contacts__link_tel {
	color: inherit;
	text-decoration: none;
}

.contacts__link_tel:hover {
	color: var(--green_logo);
}

.contacts__link {
	color: var(--headr-color);
}

.normalMap {
	min-height: fit-content;
}

.normalMap .iframe__map {
	max-width: 100%;
	max-height: 100%;
	width: 100%;
	height: 100%;

	min-height: 50vh;
}

.contacts__link_map {
	margin-top: 0.25rem;
}

.contacts__link_map:hover {
	color: var(--green_logo);
}

/* ============== ОСНОВНОЙ БЛОК ============== */
.index_content {
	text-align: justify;
}

.index_content > p {
	text-align: justify;
}

.reports-counter__wrapper {
	display: flex;
	flex-direction: column;

	align-items: center;
	justify-content: center;

	padding: 1.5rem 0.5rem 0rem 0.5rem;

	row-gap: 1rem;

	width: 100%;

	text-align: center;
}

.reports-counter__wrapper > #reportsCounter {
	color: var(--green_logo);
}


@media screen and (max-width: 565px) {
	.index_content > p {
	  text-align: left;
	}

  }

.index_contener {
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: 2rem;
}

.qr {
	height: 200px;
	width: 200px;
}

.home-img {
	position: relative;

	display: inline-flex;
	border: none;
}

.home-img,
.home-img .home-img__image,
.home-img .home-img__hover {
	border-radius: 0.75rem;
}

.home-img * {
	transition: all 0.5s;
}

.home-img__image {
	height: 100%;
	width: auto;
	max-height: 450px;
}

.home-img__hover {
	position: absolute;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: hsla(212, 11%, 70%, 0);
}

.home-img__hover_link {
	display: inline-flex;
	visibility: visible;

	width: 100px;
}

.home-img__hover_link > img {
	/* display: inline-flex; */

	width: 100px;
	height: auto;

	opacity: 0;

	transition: all 1s ease 0s !important;
}

/* .home-img:hover .home-img__hover_link,
.home-img.onscroll .home-img__hover_link {
	visibility: visible;
} */
.home-img:hover .home-img__hover_link > img,
.home-img.onscroll .home-img__hover_link > img {
	opacity: 1;
}
.home-img:hover .home-img__hover,
.home-img.onscroll .home-img__hover {
	background-color: hsla(212, 11%, 70%, 0.6);
}
.home-img:hover .home-img__link_wrapper,
.home-img.onscroll .home-img__link_wrapper {
	opacity: 1;

	position: relative;
	/* top: 0;
	left: 0; */
	transform: scale(2);
	background-color: hsla(212, 11%, 100%, 0.3);
}

@media screen and (max-width: 375px) {
	.home-img__link_wrapper:hover,
	.home-img.onscroll .home-img__link_wrapper {
		transform: scale(1.5);
	}
}

.home-img__link_wrapper {
	display: inline-flex;
	opacity: 0;

	transition: all 1s ease 0s !important;

	position: relative;

	left: 2.5%;
	top: -5%;

	padding: 15px;

	border-radius: 1rem;
}

/* .home-img__link_wrapper:hover,
.home-img.onscroll .home-img__link_wrapper {
	position: relative;
	top: 0;
	left: 0;
	transform: scale(2);
	background-color: hsla(212, 11%, 100%, 0.3);
} */

/* @media screen and (max-width: 768px) {
	.home-img__link_wrapper {
		display: none;

		position: relative;

		padding: 15px;

		border-radius: 1rem;

		transform: scale(2);
	}
	.home-img:hover .home-img__link_wrapper {
		display: inline-flex;
		background-color: hsla(212, 11%, 100%, 0.3);
	}
} */

/* ============== БЛОК ОТЧЕТА ОБ ИСПЫТАНИИ ============== */

/* НАВИГАЦИЯ */
.navbar-nav-report {
	padding: 5px, 0;
}

.nav__toggle-report,
.nav__close-report {
	color: var(--title-color);
}

.nav__toggle-report {
	display: inline-flex;
	font-size: 1.15rem;
	cursor: pointer;
}

.nav__close-report {
	font-size: 1.5rem;
	position: absolute;
	top: 1rem;
	right: 1.25rem;
	cursor: pointer;
}

.navbar-nav-report {
	display: flex;
	flex-direction: column;
	row-gap: 1.5rem;

	flex-wrap: wrap;
}

.nav-link-report {
	color: var(--title-color);
	font-weight: var(--font-medium);
}
.nav-link-report:hover {
	color: var(--green_logo);
}

.container-fluid-mdgt.container-fluid-mdgt-report {
	height: calc(var(--header-height) + 1.5rem);
	column-gap: 3rem;
	justify-content: flex-start;
}

@media screen and (max-width: 460px) {
    .container-fluid-mdgt.container-fluid-mdgt-report {
        column-gap: 1.5rem;
    }
}

.nav__toggle-report,
.nav__close-report {
	display: none;
}

.navbar-nav-report {
	flex-direction: row;
}

.navbar-collapse-report {
	margin-left: 0;
}

.navbar-collapse-report {
	width: 100%;
}

.navbar-nav-report {
	width: 100%;
	justify-content: space-between;
}

.nav-link-report {
	padding-right: 2rem;
}

/* САМ ОТЧЕТ */

.report-wrapper {
	display: flex;
	flex-direction: column;

	row-gap: 2rem;

	height: 100%;
	width: min-content;

	align-items: center;
	/* justify-content: center; */

	margin: 0 auto;

	max-width: 100%;
}

/* ========== ШАПКА ==========*/
.table-header {
	display: flex;
	height: fit-content;
	align-items: center;
	column-gap: 1rem;
	padding: 1.25rem;
}

.table-header__logo {
	width: calc(1200px * 0.07);
	height: calc(1200px * 0.07);

	color: var(--text-color-super-light);
	fill: var(--text-color-super-light);
}

.table-header__wrapper {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
}

.table-header__wrapper a {
	color: var(--text-color);

	/* color: rgb(2, 128, 1); */
	text-decoration: none;
	font-weight: bold;
}

.table-header__wrapper a:hover {
	color: var(--green_logo);
}

.table-header__title-wrapper {
	display: flex;
	align-items: flex-end;
}

.table-header__title_sub-wrapper {
	display: inline-flex;
	flex-direction: column;
	row-gap: 0.15rem;
	justify-content: center;
	line-height: 80%;
	white-space: nowrap;
}

.table-header__title_sub-1 {
	display: inline-block;
	font-weight: bold;
	font-size: var(--report-medium-font-size);
}

.table-header__title_sub-2 {
	display: inline-block;
	font-size: var(--report-smaller-font-size);
}

.table-header__title_main {
	font-size: var(--report-big-font-size);
	font-weight: bold;
	/* line-height: 80%; */
	border-bottom: 1px solid var(--title-color);
}

.table-header__url {
	font-size: var(--report-medium-font-size);
	align-self: flex-end;
}

/* ========== ТАБЛИЦА ==========*/
.table__container {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 0 1rem;
	/* padding: 10px 10px 0px 10px; */

	width: max-content;
	max-width: calc(100% - 2rem);
	min-width: fit-content;

	border: 1px solid var(--text-color-super-light);
	border-radius: 1rem;
}

.table__container.table__container-additional .table-header__title_main {
	border-bottom: none;
}


.table__container.table__container-additional {
	width: calc(100% - 2rem);
}

.table__container:hover {
	box-shadow: 1px 1px 4px hsla(212, 11%, 33%, 0.5),
		-1px -1px 4px hsla(212, 11%, 33%, 0.5);
}

.table__table {
	height: fit-content;

	width: 100%;

	min-width: 350px;
	min-height: 400px;

	border-collapse: separate;
	border-spacing: 0;

	padding: 0;
}

.table__table.table__table-additional {
	min-height: 100px;
}

.table__tbody {
	margin: 0;
	padding: 0;
}

.table__td {
	min-width: 100px;
	padding: 0.25rem 0.75rem;

	border-bottom: 1px solid var(--text-color-super-light);
}

.table__tr .table__td:first-child {
	border-right: 1px solid var(--text-color-super-light);
}

.table__tr.table__tr-additional .table__td:first-child {
	border-right: none;
}

.table__tr.table__tr-additional .table__td a{
	text-decoration: underline;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	cursor: pointer;
}

.table__tr.table__tr-additional .table__td a:hover {
	color: var(--green_logo);
}

.table__tr:first-child .table__td {
	border-top: 1px solid var(--text-color-super-light);
}

.table__tr:last-child .table__td {
	border-bottom: none;
}

.table-report__wrapper {
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
}

/* ========== БРЕЙКПОИНТЫ ==========*/

@media screen and (max-width: 900px) {
	.table-header__title-wrapper {
		flex-direction: column;
		align-items: center;
		row-gap: 0.25rem;
	}
	.table-header__title_sub-wrapper {
		align-items: center;
	}
}

@media screen and (max-width: 630px) {
	:root {
		--report-main-font-size: 0.9rem;
		--report-big-font-size: 1.75rem;
		--report-medium-font-size: 1.1rem;
		--report-smaller-font-size: 0.8rem;
	}

	.table-header__logo {
		width: calc(1200px * 0.06);
		height: calc(1200px * 0.06);
	}
}

@media screen and (max-width: 565px) {
	:root {
		--report-main-font-size: 0.8rem;
		--report-big-font-size: 1.6rem;
		--report-medium-font-size: 0.95rem;
		--report-smaller-font-size: 0.75rem;
	}

	.table-header__logo {
		width: calc(1200px * 0.05);
		height: calc(1200px * 0.05);
	}

	.table__table {
		min-width: 300px;
		min-height: 300px;
	}
}

@media screen and (max-width: 520px) {
	:root {
		--report-main-font-size: 0.7rem;
		--report-big-font-size: 1.25rem;
		--report-medium-font-size: 0.8rem;
		--report-smaller-font-size: 0.65rem;
	}

	.table-header__logo {
		width: calc(1200px * 0.04);
		height: calc(1200px * 0.04);
	}
	.table__table {
		min-width: 260px;
		min-height: 260px;
	}
}

@media screen and (max-width: 450px) {
	.table__container.table__container-additional {
		width: calc(100%);
	}

	.table-header {
		flex-direction: column;
		row-gap: 0.5rem;
		padding: 0.25rem;
	}

	.table__container {
		margin: 0;
	}

	.table__table {
		min-width: 200px;
		min-height: 200px;
	}
	.navbar-collapse {
		width: 70%;
	}
}

/* ========== БРЕЙКПОИНТЫ ==========*/
.btn-buy {
	border-color: var(--green_logo);
	background-color: var(--green_logo);
}

.btn-test:hover, .btn-test:focus,
.btn-buy:hover, .btn-buy:focus,
.btn-out:hover, .btn-out:focus
 {
	border-color: var(--green_logo_hover);
	background-color: var(--green_logo_hover);
}

.btn-test:focus,
 .btn-buy:focus,
 .btn-out:focus
 {
	box-shadow: 0 0 0 0.25rem var(--green_logo_shadow);
}


.btn-success.disabled, .btn-success:disabled {
	border-color: var(--green_logo);
	background-color: var(--green_logo);
	opacity: 0.6;
}

.btn-test {
	border-color: var(--green_logo);
	background-color: var(--green_logo);
}

.btn-out {
	border-color: var(--green_logo);
	background-color: var(--green_logo);
}

.form-control:focus {
	border-color: var(--green_logo_hover);
	box-shadow: 0 0 0 0.25rem var(--green_logo_form);
}

/* ========== КУКИ ==========*/
.toast:not(.showing):not(.show) {
	opacity: 0;
	display: none !important;
}

/* ========== ЛИЧНЫЙ КАБИНЕТ ==========*/
/* НАВИГАЦИЯ */
@media screen and (max-width: 460px) {
	/* оболочка для создания затемненной части */
	.navbar-collapse-wrapper-personal {
		background-color: hsla(var(--hue), 24%, 15%, 0.5);
		position: fixed;
		top: 0;
		width: 100%;
		height: 100%;
		/* right: 0; */
		right: -100%;
		z-index: calc(var(--z-fixed) - 1);
		overflow-y: auto;
	}

	/* сам список ссылок + кнопка "закрыть" */
	.navbar-collapse-personal {
		position: absolute;
		background-color: var(--container-color);
		width: 50%;
		height: 100%;
		/* top: 0; */
		/* right: 0; */
		right: -100%;
		box-shadow: -2px 0 4px hsla(var(--hue), 24%, 15%, 0.1);
		padding: 4rem 0 0 3rem;
		border-radius: 1rem 0 0 1rem;
		transition: 0.3s;
		z-index: var(--z-fixed);
		overflow: auto;
	}

	.nav-item-personal:last-child {
		margin-bottom: 1.5rem;
	}
}

.navbar-nav-personal {
	padding: 5px, 0;
}

.nav__toggle-personal,
.nav__close-personal {
	color: var(--title-color);
}

.nav__toggle-personal {
	display: inline-flex;
	font-size: 1.15rem;
	cursor: pointer;
}

.nav__close-personal {
	font-size: 1.5rem;
	position: absolute;
	top: 1rem;
	right: 1.25rem;
	cursor: pointer;
}

.navbar-nav-personal {
	display: flex;
	flex-direction: column;
	row-gap: 1.5rem;

	flex-wrap: wrap;
}

.nav-link-personal {
	color: var(--title-color);
	font-weight: var(--font-medium);
}
.nav-link-personal:hover {
	color: var(--green_logo);
}

.navbar-collapse-wrapper-personal.navbar-collapse-wrapper-show,
.navbar-collapse-personal.navbar-collapse-show {
	right: 0;
}

/* ======== БРЕЙКПОИНТЫ ДЛЯ РАЗНЫХ РАЗМЕРОВ ЭКРАНОВ ======== */
@media screen and (min-width: 461px) {
	.container-fluid-mdgt.container-fluid-mdgt-personal {
		height: calc(var(--header-height) + 1.5rem);
		column-gap: 3rem;
		justify-content: flex-start;
	}

	.nav__toggle-personal,
	.nav__close-personal {
		display: none;
	}

	.navbar-nav-personal {
		flex-direction: row;
	}

	.navbar-collapse-wrapper-personal,
	.navbar-collapse-personal {
		margin-left: 0;
	}
	/* ========== Шапка для личного кабинета ==========*/

	.navbar-collapse-personal {
		width: 100%;
	}

	.navbar-nav-personal {
		width: 100%;
		justify-content: space-between;
	}
	.navbar-collapse-wrapper-personal {
		width: 100%;
	}

	.nav-link-personal {
		padding-right: 2rem;
	}
}

/* ФОРМА ВХОДА */

#login-form {
	width: 260px;
	max-width: 100%;
}

#login-form.row.form-row {
	row-gap: 1rem;
}

/* УДАЛЕНИЕ ОТЧЕТА, ЗАПРОС ТОКЕНА */
.action {
	display: flex;
}

.table-report__wrapper th {
	vertical-align: top;
}
.del-report-modal__wrapper,
.request-token-modal__wrapper {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1001;

	width: 100vw;
	height: 100vh;

	display: flex;
	align-items: center;
	justify-content: center;

	opacity: 0;
	transition-duration: 250ms;
	transition-property: opacity, visibility;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	visibility: hidden;
}

.del-report-modal,
.request-token-modal {
	max-height: 360px;
	min-width: 240px;
	max-width: 240px;

	border-radius: 4px;

	background-color: #fff;

	display: flex;
	flex-direction: column;

	box-shadow: 0px 11px 15px -7px rgb(0 0 0 / 20%),
		0px 24px 38px 3px rgb(0 0 0 / 14%), 0px 9px 46px 8px rgb(0 0 0 / 12%);

	opacity: 0;
	transition-duration: 250ms;
	transition-property: opacity, visibility;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	visibility: hidden;
}

.del-report-modal__wrapper.del-report-modal__wrapper_show,
.del-report-modal__wrapper.del-report-modal__wrapper_show .del-report-modal,
.request-token-modal__wrapper.request-token-modal__wrapper_show,
.request-token-modal__wrapper.request-token-modal__wrapper_show .request-token-modal {
	opacity: 1;
	visibility: visible;
}

.del-report__title,
.request-token__title {
	font-size: var(--h2-font-size);
	font-weight: var(--font-semi-bold);
	letter-spacing: 0.0125em;
	display: block;
	position: relative;
	padding: 0 24px 9px;
	margin: 0;

	border-bottom: 1px solid transparent;
}

.del-report__title::before,
.request-token__title::before {
	display: inline-block;
	width: 0;
	height: 40px;
	content: '';
	vertical-align: 0;
}

.del-report__content,
.request-token__content {
	padding: 20px 24px;
	padding-top: 0;

	opacity: 0.6;
	font-size: var(--normal-font-size);
	line-height: 1.5rem;
	font-weight: var(--font-base);
	letter-spacing: 0.03125em;
}

.del-report__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	min-height: 52px;
	padding: 8px;
	border-top: 1px solid transparent;
	column-gap: 8px;
}

.del-report__btn,
.request-token__btn {
	text-align: right;
	height: 36px;

	font-size: var(--normal-font-size);
	font-weight: var(--font-medium);
	padding: 0 8px 0 8px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 64px;
	border-radius: 4px;

	color: var(--first-color);
}

.action {
	display: flex;
}

.table-report__wrapper th {
	vertical-align: top;
}

.request-token__wrapper {
	width: 100%;

	border: 1px solid #e9ecef;
	border-radius: 0.25rem;

	padding: 1rem;

	display: flex;
	flex-direction: column;
	row-gap: 1rem;
}

.request-token__wrapper a{
	color: inherit;
}

/* ========== РЕДАКТОР ОПЫТОВ ==========*/

.request-report__wrapper {
	width: 100%;

	border: 1px solid #e9ecef;
	border-radius: 0.25rem;

	padding: 1rem;

	display: flex;
	flex-direction: column;
	row-gap: 1rem;
}

.request-report__description {
	text-align: justify;
}

@media screen and (max-width: 565px) {
	.request-report__description {
		text-align: left;
  }}

.request-form__actions {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	column-gap: 8px;
}

.bi {
	display: inline-block;
	vertical-align: -0.125em;
	fill: currentcolor;

	width: 1em;
	height: 1em;
}

.input-group.has-validation .input-group-text {
	cursor: pointer;
	position: relative;
}

.input-group.has-validation .input-group-text:hover .form-info-box {
	visibility: visible;
	z-index: 10;
}

.input-group.has-validation .input-group-text .form-info-box {
	visibility: hidden;
	position: absolute;

	top: calc(100% + 2px);
	left: -1px;

	width: fit-content;

	padding: 0.375rem 0.75rem;
	background-color: #e9ecef;

	border-top-right-radius: 0.25rem;
	border-bottom-right-radius: 0.25rem;

	border-radius: 0.25rem;
	border: 1px solid #ced4da;
	z-index: 0;
}

.request-report-succses {
	width: 100%;

	text-align: center;
	color: var(--first-color);

	display: none;
}

.request-report-succses__sub {
	font-size: var(--smaller-font-size);
	opacity: 0.6;
}

.request-report-succses.request-report-succses-show {
	display: inline-block;
}

.verticalScroll {
  height: 400px;
  overflow-y: scroll;
}

.horizontalScroll {
  width: 500px;
  overflow-y: scroll;
}









/* Global Variables */
:root {
    --color1: #ededed;
    --color2: #64c1cf;
    --color3: #b1c3c1;
    --color4: #bd9ac8;
    --color5: #6d87b5;
    --color6: #00acb5;
    --color7: #dbd3b1;
    --color8: #ffffff;
    --color9: #edf2f2;
    --color10: #4d5972;
}

/* Reset Default Settings */
.container-fidure {
	/* padding: 85px 0 calc(85px + 70px / 2); */
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}

/* Figure */
.figure {
	display: flex;
	flex-direction: column;

	row-gap: 2.5rem;

	width: 100%;
}

.figure:nth-of-type(2) {
    margin-left: 35px;
    margin-top: 70px;
}

/* Path */
.figure__path {
    /* Flex */
    display: flex;
    align-items: center;
}


.figure__path_wrapper{
	display: flex;
	flex-direction: column;
	position: relative;
}

.figure__path_rest{
	position: absolute;
	top: 22px;
	left: calc(22px / 2);

	transform: translateX(-50%);

	display: flex;
	flex-direction: column;
}

.figure__pathStart {
    width: 22px;
    height: 22px;
    border: solid 4px var(--color1);
    outline: solid 3.5px;
    border-radius: 50%;
    position: relative;
}


.figure__pathPoint {
    background-color: var(--title-color);
    width: 9px;
    height: 9px;
    margin-top: 16px;
    border-radius: 50%;
}

.figure__pathPoint:last-of-type {
    margin-bottom: 16px;
}

.figure__path:last-of-type .figure__pathPoint {
    display: none;
}

/* Product */
.figure__product {
    /* width: 350px; */
	width: calc(100% - 50px);
    height: 150px;
    padding: 0 20px;
    border-radius: 1000px;

	position: relative;

    /* Position */
    /* position: absolute; */
    /* right: 50px; */
    /* top: 50%; */
    /* transform: translateY(-50%); */

    /* Flex */
    display: flex;
    align-items: center;
	justify-content: flex-end;

	column-gap: 1.5rem;
}

.figure__product::before {
    width: 0;
    height: 0;
    border: solid 15px;
    border-color: transparent transparent transparent var(--color2);

    content: '';
    position: absolute;
    right: calc(-2 * 15px + 2px);
    top: 50%;
    transform: translateY(-50%);
}

.figure__path:nth-of-type(2) .figure__product::before {
    border-color: transparent transparent transparent var(--color3);
}

.figure__path:nth-of-type(3) .figure__product::before {
    border-color: transparent transparent transparent var(--color4);
}

/* Product - Right */
.figure__product--right {
    left: 50px;
    flex-direction: row-reverse;
}

.figure__product--right::before {
    border-color: transparent var(--brown_logo) transparent transparent;
    left: calc(-2 * 15px + 2px);
}

.figure__path:nth-of-type(2) .figure__product--right::before {
    border-color: transparent var(--beige_logo) transparent transparent;
}

.figure__path:nth-of-type(3) .figure__product--right::before {
    border-color: transparent var(--green_logo) transparent transparent;
}

.figure__productContent {
    padding: 10px 0;

    /* Flex */
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.figure__productName {
    color: var(--color8);
    margin-bottom: 5px;
    font-size: 22px;
    font-weight: 500;
}

.figure__productDesc {
    color: var(--color8);
    font-size: var(--normal-font-size);
    font-weight: 400;

	padding: 0.5rem 0.75rem;
	padding-left: 0;

	text-align: left;
}

.figure__productIconBox {
    background-color: #e3e5e8;
    width: 95px;
	min-width: 95px;
    height: 95px;
    padding: 15px;
    border-radius: 50%;
    box-shadow: rgba(50, 50, 93, 0.25) 10px 13px 27px -5px, rgba(0, 0, 0, 0.3) 10px 8px 16px -8px;

    /* Flex */
    display: flex;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 565px) {

	.figure__product--right{
		left: 20px;
	}

	.figure__productIconBox {
		width: 55px;
		min-width: 55px;
		height: 55px;
  }

  .figure__product{
	column-gap: 0.5rem;
  }

  .figure__productDesc {
	font-size: var(--smaller-font-size);
  }
}


@media screen and (max-width: 360px) {
  .figure__productDesc {
	font-size: 0.47rem;
  }
}

@media screen and (max-width: 420px) and (min-width: 361px) {
	.figure__productDesc {
	  font-size: 0.67rem;
	}
  }


.figure__product--right .figure__productIconBox {
    box-shadow: rgba(50, 50, 93, 0.25) -10px 13px 27px -5px, rgba(0, 0, 0, 0.3) -10px 8px 16px -8px;
}

.figure__productIcon {
    width: 60px;
    height: 60px;
}

/* ДОРАБОТКА КАРТОЧЕК */

.card-group {
	column-gap: 0.75rem;
}

.card-group .card .text-start{
	font-size: var(--small-font-size);
}

.card-group .card ul {
	margin-top: 1.5rem;
	list-style: none;
}