/* Root */
:root {

	---cmt-text100-color: rgb(81 90 90 / 100%);
	---cmt-text80-color: rgb(81 90 90 / 80%);
	---cmt-text70-color: rgb(81 90 90 / 70%);

	---cmt-Dtext100-color: rgb(65 72 72 / 100%);
	---cmt-Dtext80-color: rgb(65 72 72 / 80%);
	---cmt-Dtext70-color: rgb(65 72 72 / 70%);

	---cmt-Ltext100-color: rgb(101 113 113 / 100%);
	---cmt-Ltext80-color: rgb(101 113 113 / 80%);
	---cmt-Ltext70-color: rgb(101 113 113 / 70%);


	---cmt-background-color: #FFFFFF;
	---cmt-outline-color: #E0E4E5;

	---cmt-Dbackground-color: #cccccc;
	---cmt-Doutline-color: #C6CECE;

	---cmt-white-color: #FFFFFF;
	---cmt-silver-color: #BDC3C7;

	---cmt-Dwhite-color: #cccccc;
	---cmt-Dsilver-color: #BDC3C7;

	---cmt-Lwhite-color: #FFFFFF;
	---cmt-Lsilver-color: #BDC3C7;




}
/* Root */



/* Monitoring / Мониторинг */
.monitoring__outline {
	border: 1px solid transparent;
	border-color: var(---cmt-outline-color);

	transition: border-color 0.3s ease;
}
.monitoring__outline:hover {
	border-color: var(---cmt-Doutline-color);
}

.monitoring_shadow {
	box-shadow: 0px 0px 7px rgba(0,0,0,0.4);

	transition: box-shadow 0.3s ease;
}
.monitoring_shadow:hover {
	box-shadow: 0px 0px 10px var(---cmt-white-color);
}

.monitoring__inner {
	display: flex;
	flex-direction: column;
	/*flex-wrap: wrap;*/
	gap: calc(44px / 3);
	margin-bottom: 24px;
}
.monitoring {
	display: flex;
	flex-direction: column;
	/*justify-content: center;
	align-items: center;*/
	width: 100%;
	height: 100%;

	border-radius: 16px;

	background-color: var(---cmt-background-color);

	color: var(---cmt-text100-color);

	transition: box-shadow 0.3s ease, border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease, width 0.3s ease, filter 0.3s ease, opacity 0.3s ease;
}
.monitoring__wrapper {
	overflow: hidden;
}
.monitoring__content {
	display: flex;
	margin-top: auto;
	padding: 8px;
	/*padding: 7px;*/
}
.monitoring__icon {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;

	border-radius: 50%;

	background-color: var(---cmt-outline-color);
}
.monitoring__icon img {
	width: 32px;
	height: 32px;
}
.monitoring__info h3{
	font-size: 19px;
}
.monitoring__info h5{
	font-size: 13px;
}
.monitoring__info {
	margin-left: 4px;
}
.monitoring__description {
	font-weight: 500;
	text-transform: uppercase;
	color: var(---cmt-text70-color);
}
.monitoring__title {
	font-weight: 600;
	color: var(---cmt-text80-color);
}
.monitoring__amount {
	margin-left: auto;

	text-align: end;
	color: var(---cmt-text80-color);
}
.monitoring__i {
	font-weight: 700;
}
.monitoring__j {
	font-weight: 500;
}
.monitoring__line {
	width: 100%;
}
.monitoring__progress {
	width: 100%;
	height: 21px;

	background-image: url(../images/progress_bar/background.png);
	background-repeat: no-repeat;
}
.monitoring__progress--active {
	width: 100%;
	height: 21px;

	background-image: url(../images/progress_bar/line_active.png);
	background-repeat: no-repeat;
	/*filter: hue-rotate(351deg);*/
	filter: hue-rotate(1deg);

	animation: gradient_line 4s infinite alternate;
	transition: box-shadow 0.3s ease, border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease, width 4s ease, filter 0.3s ease, opacity 0.3s ease, filter 4s ease;
}
/* Monitoring / Мониторинг */



/* Animation / Анимация */
/*animation: blinking 0.8s infinite alternate;*/
@keyframes gradient_line {
	0% {filter: hue-rotate(1deg);}
	12.5% {filter: hue-rotate(45deg);}
	25% {filter: hue-rotate(90deg);}
	37.5% {filter: hue-rotate(135deg);}
	50% {filter: hue-rotate(180deg);}
	62.5% {filter: hue-rotate(225deg);}
	75% {filter: hue-rotate(270deg);}
	87.5% {filter: hue-rotate(315deg);}
	100% {filter: hue-rotate(351deg);}
}
/* Animation / Анимация */