

/* Start:/bitrix/templates/aspro_max/css/custom/text-elements.css?17836895574102*/
/* ------------ graphic ------------ */
.graphic {
	--graphic-title-mb: 50px;
	--graphic-title-img-w: 124px;
	--graphic-title-img-h: 140px;
	--graphic-title-gap: 30px;
	--graphic-title-fz: 24px;
	--graphic-title-lh: 1.2;
	--graphic-list-pl: 28px;
	--graphic-lineblock-pl: 25px;
}

@media (max-width: 991px) {
	.graphic {
		--graphic-title-mb: 30px;
		--graphic-title-img-w: 80px;
		--graphic-title-img-h: 90px;
		--graphic-title-gap: 25px;
		--graphic-title-fz: 20px;
	}
}

@media (max-width: 500px) {
	.graphic {
		--graphic-list-pl: 18px;
		--graphic-lineblock-pl: 12px;
	}
}

@media (max-width: 450px) {
	.graphic {
		--graphic-title-fz: 18px;
		--graphic-title-lh: 1;
	}
}

.graphic:not(:last-child) {
	margin-bottom: 100px;
}

.graphic h3,
.graphic h4,
.graphic h5 {
	color: #555;
}

.graphic__title {
	position: relative;
	height: 70px;
	margin-bottom: var(--graphic-title-mb);
}

.graphic__title-img {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: var(--graphic-title-img-w);
	height: var(--graphic-title-img-h);
}

.graphic__title-img>img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.graphic__title-text {
	height: 100%;
	width: 100%;
	padding-left: calc(var(--graphic-title-img-w) / 2);
	overflow: hidden;
}

.graphic__title-text>h3 {
	display: flex;
	align-items: center;
	height: 100%;
	width: 100%;
	margin: 0;
	padding-left: calc(var(--graphic-title-img-w) / 2 + var(--graphic-title-gap));
	background-color: #F8F8F8;
	font-size: var(--graphic-title-fz);
	line-height: var(--graphic-title-lh);
}

.graphic__list {
	padding-left: var(--graphic-list-pl);
	margin-top: 0;
	margin-bottom: 25px;
}

.graphic__list>li {
	position: relative;
	padding-left: 14px;
	margin: 0;
}

.graphic__list>li:not(:last-child) {
	margin-bottom: 8px;
}

.graphic__list>li::before {
	content: '' !important;
	display: block;
	position: absolute;
	top: 12px;
	left: 0px;
	width: 4px;
	height: 4px;
	margin: 0 !important;
	border-radius: 50%;
	background-color: #555;
}

.graphic__line-block {
	padding-left: var(--graphic-lineblock-pl);
	border-left: 2px solid #21B24B;
}

.graphic__line-block h5 {
	margin-bottom: 15px;
}

.graphic__line-block .graphic__list {
	padding-left: 8px;
}

.graphic__line-block .graphic__list>li:not(:last-child) {
	margin-bottom: 8px;
}











/* ------------ icons ------------ */
.icon {
	display: flex;
	justify-content: center;
	align-items: center;
}

.icon::before {
	content: "";
	display: block;
	width: var(--icon-size, var(--icon-width, 100%));
	height: var(--icon-size, var(--icon-height, 100%));
	pointer-events: none;
	mask-position: center;
	mask-repeat: no-repeat;
	mask-size: contain;
	background-repeat: no-repeat;
	background-size: contain;
	transition: background-color 300ms ease-out;
}

.icon._archive::before {
	mask-image: url("/bitrix/templates/aspro_max/images/custom/icons/archive.svg");
}

.icon._box::before {
	mask-image: url("/bitrix/templates/aspro_max/images/custom/icons/box.svg");
}

.icon._card::before {
	mask-image: url("/bitrix/templates/aspro_max/images/custom/icons/card.svg");
}

.icon._location::before {
	mask-image: url("/bitrix/templates/aspro_max/images/custom/icons/location.svg");
}

.icon._truck::before {
	mask-image: url("/bitrix/templates/aspro_max/images/custom/icons/truck.svg");
}

.icon._wallet::before {
	mask-image: url("/bitrix/templates/aspro_max/images/custom/icons/wallet.svg");
}

.icon._lightning::before {
	mask-image: url("/bitrix/templates/aspro_max/images/custom/icons/lightning.svg");
}

.icon._green::before {
	background-color: #21B24B;
}







.icon-list {}

.icon-list>li {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin: 0;
}

.icon-list>li:not(:last-child) {
	margin-bottom: 25px;
}

.icon-list>li:before {
	display: none !important;
}

.icon-list>li>.icon {
	--icon-size: 24px;
}
/* End */
/* /bitrix/templates/aspro_max/css/custom/text-elements.css?17836895574102 */
