/*BUILD CLASS BY ULIANOV ALEXEY*/
/*v2.0.0 2024*/

/*---------------------------*/
/*----- General Settings ----*/
/*---------------------------*/

*,
:after,
:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/*---- For old browsers ----*/

@supports (not(--css: variables)) {
	.supports_error {
		display: flex !important;
	}
}

/*---- For IE ----*/

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
	.supports_error {
		display: flex !important;
	}
}

:root {
	--gap-value-1: 5px;
	--gap-value-2: 10px;
	--flex-carousel-item: 560px;
}

.flex {
	display: -ms-flexbox;
	display: flex;
	flex: 1;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-flex-basis: 100%;
	flex-basis: 100%;
}

/*---------------------------*/
/*--------- location --------*/
/*---------------------------*/

@media screen and (max-width: 767px) {
	.flex.xs-column {
		flex-direction: column;
	}

	.flex.md-row {
		flex-direction: row;
	}

	.flex.xs-column-reverse {
		flex-direction: column-reverse;
	}

	.flex.xs-row-reverse {
		flex-direction: row-reverse;
	}

	.xs-hide {
		display: none !important;
	}

	.xs-show {
		display: block !important;
	}
}

@media screen and (min-width: 768px) {
	.sm-hide {
		display: none !important;
	}

	.sm-show {
		display: block !important;
	}

	.flex.sm-column {
		flex-direction: column;
	}

	.flex.sm-row {
		flex-direction: row;
	}

	.flex.sm-column-reverse {
		flex-direction: column-reverse;
	}

	.flex.sm-row-reverse {
		flex-direction: row-reverse;
	}
}

@media screen and (min-width: 1024px) {
	.md-hide {
		display: none !important;
	}

	.md-show {
		display: block !important;
	}

	.flex.md-column {
		flex-direction: column;
	}

	.flex.md-row {
		flex-direction: row;
	}

	.flex.md-column-reverse {
		flex-direction: column-reverse;
	}

	.flex.md-row-reverse {
		flex-direction: row-reverse;
	}
}

@media screen and (min-width: 1260px) {
	.lg-hide {
		display: none !important;
	}

	.lg-show {
		display: block !important;
	}
}

.flex.column {
	flex-direction: column;
}

.flex.column-reverse {
	flex-direction: column-reverse;
}

.flex.row-reverse {
	flex-direction: row-reverse;
}

.flex.nowrap {
	flex-wrap: nowrap;
}

.flex.stretch {
	align-items: stretch;
}

.flex.stretch>*>* {
	height: 100%;
}

.flex.nowrap {
	flex-wrap: nowrap;
}

/*---------------------------*/
/*------- Modular grid ------*/
/*---------------------------*/

.flex.row,
.flex.row_2 {
	flex-direction: row;
	-ms-flex-basis: 100%;
	flex-basis: 100%;
}

.flex.row {
	margin-left: calc(var(--gap-value-1) - var(--gap-value-1) * 2);
	margin-right: calc(var(--gap-value-1) - var(--gap-value-1) * 2);
}

.flex.row_2 {
	margin-left: calc(var(--gap-value-2) - var(--gap-value-2) * 2);
	margin-right: calc(var(--gap-value-2) - var(--gap-value-2) * 2);
}

.flex.row>* {
	padding-left: var(--gap-value-1);
	padding-right: var(--gap-value-1);
}

.flex.row_2>* {
	padding-left: var(--gap-value-2);
	padding-right: var(--gap-value-2);
}

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

	.xs-grow {
		flex: 1 0 0% !important;
	}

	.xs-auto {
		flex: 0 0 auto !important;
		width: auto !important;
	}

	.xs-1 {
		flex: 0 0 8.33333333%;
		max-width: 8.33333333%;
	}

	.xs-2 {
		flex: 0 0 16.66666667%;
		max-width: 16.66666667%;
	}

	.xs-3 {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.xs-4 {
		flex: 0 0 33.3333%;
		max-width: 33.3333%;
	}

	.xs-5 {
		flex: 0 0 41.66667%;
		max-width: 41.66667%;
	}

	.xs-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.xs-7 {
		flex: 0 0 58.33333%;
		max-width: 58.33333%;
	}

	.xs-8 {
		flex: 0 0 66.66666667%;
		max-width: 66.66666667%;
	}

	.xs-9 {
		flex: 0 0 75%;
		max-width: 75%;
	}

	.xs-10 {
		max-width: 83.33333333%;
		flex: 0 0 83.33333333%;
	}

	.xs-11 {
		max-width: 91.66666667%;
		flex: 0 0 91.66666667%;
	}

	.xs-12 {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.xs-20pr {
		flex: 0 0 20%;
		max-width: 20%;
	}

	/*--procent col--*/

	.xs-10pr {
		flex: 0 0 10%;
		max-width: 10%;
	}

	.xs-15pr {
		flex: 0 0 15%;
		max-width: 15%;
	}

	.xs-20pr {
		flex: 0 0 20%;
		max-width: 20%;
	}

	.xs-30pr {
		flex: 0 0 30%;
		max-width: 30%;
	}

	.xs-35pr {
		flex: 0 0 35%;
		max-width: 35%;
	}

	.xs-40pr {
		flex: 0 0 40%;
		max-width: 40%;
	}

	.xs-45pr {
		flex: 0 0 45%;
		max-width: 45%;
	}

	.xs-55pr {
		flex: 0 0 55%;
		max-width: 55%;
	}

	.xs-60pr {
		flex: 0 0 60%;
		max-width: 60%;
	}

	.xs-65pr {
		flex: 0 0 65%;
		max-width: 65%;
	}

	.xs-70pr {
		flex: 0 0 70%;
		max-width: 70%;
	}

	.xs-85pr {
		flex: 0 0 85%;
		max-width: 85%;
	}

	.xs-85pr {
		flex: 0 0 85%;
		max-width: 85%;
	}

	.xs-90pr {
		flex: 0 0 90%;
		max-width: 90%;
	}
}

@media screen and (min-width: 768px) {

	.sm-grow {
		flex: 1 0 0% !important;
	}

	.sm-auto {
		flex: 0 0 auto !important;
		width: auto !important;
	}

	.sm-1 {
		flex: 0 0 8.33333333%;
		max-width: 8.33333333%;
	}

	.sm-2 {
		flex: 0 0 16.66666667%;
		max-width: 16.66666667%;
	}

	.sm-3 {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.sm-4 {
		flex: 0 0 33.3333%;
		max-width: 33.3333%;
	}

	.sm-5 {
		flex: 0 0 41.66667%;
		max-width: 41.66667%;
	}

	.sm-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.sm-7 {
		flex: 0 0 58.33333%;
		max-width: 58.33333%;
	}

	.sm-8 {
		flex: 0 0 66.66666667%;
		max-width: 66.66666667%;
	}

	.sm-9 {
		flex: 0 0 75%;
		max-width: 75%;
	}

	.sm-10 {
		max-width: 83.33333333%;
		flex: 0 0 83.33333333%;
	}

	.sm-11 {
		max-width: 91.66666667%;
		flex: 0 0 91.66666667%;
	}

	.sm-12 {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.sm-20pr {
		flex: 0 0 20%;
		max-width: 20%;
	}

	/*--procent col--*/

	.sm-10pr {
		flex: 0 0 10%;
		max-width: 10%;
	}

	.sm-15pr {
		flex: 0 0 15%;
		max-width: 15%;
	}

	.sm-20pr {
		flex: 0 0 20%;
		max-width: 20%;
	}

	.sm-30pr {
		flex: 0 0 30%;
		max-width: 30%;
	}

	.sm-35pr {
		flex: 0 0 35%;
		max-width: 35%;
	}

	.sm-40pr {
		flex: 0 0 40%;
		max-width: 40%;
	}

	.sm-45pr {
		flex: 0 0 45%;
		max-width: 45%;
	}

	.sm-55pr {
		flex: 0 0 55%;
		max-width: 55%;
	}

	.sm-60pr {
		flex: 0 0 60%;
		max-width: 60%;
	}

	.sm-65pr {
		flex: 0 0 65%;
		max-width: 65%;
	}

	.sm-70pr {
		flex: 0 0 70%;
		max-width: 70%;
	}

	.sm-80pr {
		flex: 0 0 80%;
		max-width: 80%;
	}

	.sm-85pr {
		flex: 0 0 85%;
		max-width: 85%;
	}

	.sm-90pr {
		flex: 0 0 90%;
		max-width: 90%;
	}
}

@media screen and (min-width: 1024px) {

	.md-grow {
		flex: 1 0 0% !important;
	}

	.md-auto {
		flex: 0 0 auto !important;
		width: auto !important;
	}

	.md-1 {
		flex: 0 0 8.33333333%;
		max-width: 8.33333333%;
	}

	.md-2 {
		flex: 0 0 16.66666667%;
		max-width: 16.66666667%;
	}

	.md-3 {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.md-4 {
		flex: 0 0 33.3333%;
		max-width: 33.3333%;
	}

	.md-5 {
		flex: 0 0 41.66667%;
		max-width: 41.66667%;
	}

	.md-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.md-7 {
		flex: 0 0 58.33333%;
		max-width: 58.33333%;
	}

	.md-8 {
		flex: 0 0 66.66666667%;
		max-width: 66.66666667%;
	}

	.md-9 {
		flex: 0 0 75%;
		max-width: 75%;
	}

	.md-10 {
		max-width: 83.33333333%;
		flex: 0 0 83.33333333%;
	}

	.md-11 {
		max-width: 91.66666667%;
		flex: 0 0 91.66666667%;
	}

	.md-12 {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.md-20pr {
		flex: 0 0 20%;
		max-width: 20%;
	}

	/*--procent col--*/

	.md-10pr {
		flex: 0 0 10%;
		max-width: 10%;
	}

	.md-15pr {
		flex: 0 0 15%;
		max-width: 15%;
	}

	.md-20pr {
		flex: 0 0 20%;
		max-width: 20%;
	}

	.md-30pr {
		flex: 0 0 30%;
		max-width: 30%;
	}

	.md-35pr {
		flex: 0 0 35%;
		max-width: 35%;
	}

	.md-40pr {
		flex: 0 0 40%;
		max-width: 40%;
	}

	.md-45pr {
		flex: 0 0 45%;
		max-width: 45%;
	}

	.md-55pr {
		flex: 0 0 55%;
		max-width: 55%;
	}

	.md-60pr {
		flex: 0 0 60%;
		max-width: 60%;
	}

	.md-65pr {
		flex: 0 0 65%;
		max-width: 65%;
	}

	.md-70pr {
		flex: 0 0 70%;
		max-width: 70%;
	}

	.md-85pr {
		flex: 0 0 85%;
		max-width: 85%;
	}

	.md-85pr {
		flex: 0 0 85%;
		max-width: 85%;
	}

	.md-90pr {
		flex: 0 0 90%;
		max-width: 90%;
	}
}

@media screen and (min-width: 1260px) {

	.lg-grow {
		flex: 1 0 0% !important;
	}

	.lg-auto {
		flex: 0 0 auto !important;
		width: auto !important;
	}

	.lg-1 {
		flex: 0 0 8.33333333%;
		max-width: 8.33333333%;
	}

	.lg-2 {
		flex: 0 0 16.66666667%;
		max-width: 16.66666667%;
	}

	.lg-3 {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.lg-4 {
		flex: 0 0 33.3333%;
		max-width: 33.3333%;
	}

	.lg-5 {
		flex: 0 0 41.66667%;
		max-width: 41.66667%;
	}

	.lg-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.lg-7 {
		flex: 0 0 58.33333%;
		max-width: 58.33333%;
	}

	.lg-8 {
		flex: 0 0 66.66666667%;
		max-width: 66.66666667%;
	}

	.lg-9 {
		flex: 0 0 75%;
		max-width: 75%;
	}

	.lg-10 {
		max-width: 83.33333333%;
		flex: 0 0 83.33333333%;
	}

	.lg-11 {
		max-width: 91.66666667%;
		flex: 0 0 91.66666667%;
	}

	.lg-12 {
		flex: 0 0 100%;
		max-width: 100%;
	}

	/*--procent col--*/

	.lg-10pr {
		flex: 0 0 10%;
		max-width: 10%;
	}

	.lg-15pr {
		flex: 0 0 15%;
		max-width: 15%;
	}

	.lg-20pr {
		flex: 0 0 20%;
		max-width: 20%;
	}

	.lg-30pr {
		flex: 0 0 30%;
		max-width: 30%;
	}

	.lg-35pr {
		flex: 0 0 35%;
		max-width: 35%;
	}

	.lg-40pr {
		flex: 0 0 40%;
		max-width: 40%;
	}

	.lg-45pr {
		flex: 0 0 45%;
		max-width: 45%;
	}

	.lg-55pr {
		flex: 0 0 55%;
		max-width: 55%;
	}

	.lg-60pr {
		flex: 0 0 60%;
		max-width: 60%;
	}

	.lg-65pr {
		flex: 0 0 65%;
		max-width: 65%;
	}

	.lg-70pr {
		flex: 0 0 70%;
		max-width: 70%;
	}

	.lg-85pr {
		flex: 0 0 85%;
		max-width: 85%;
	}

	.lg-85pr {
		flex: 0 0 85%;
		max-width: 85%;
	}

	.lg-90pr {
		flex: 0 0 90%;
		max-width: 90%;
	}
}

.col-1 {
	flex: 0 0 8.33333333%;
	max-width: 8.33333333%;
}

.col-2 {
	flex: 0 0 16.66666667%;
	max-width: 16.66666667%;
}

.col-3 {
	flex: 0 0 25%;
	max-width: 25%;
}

.col-4 {
	flex: 0 0 33.3333%;
	max-width: 33.3333%;
}

.col-5 {
	flex: 0 0 41.66667%;
	max-width: 41.66667%;
}

.col-6 {
	flex: 0 0 50%;
	max-width: 50%;
}

.col-7 {
	flex: 0 0 58.33333%;
	max-width: 58.33333%;
}

.col-8 {
	flex: 0 0 66.66666667%;
	max-width: 66.66666667%;
}

.col-9 {
	flex: 0 0 75%;
	max-width: 75%;
}

.col-10 {
	max-width: 83.33333333%;
	flex: 0 0 83.33333333%;
}

.col-11 {
	max-width: 91.66666667%;
	flex: 0 0 91.66666667%;
}

.col-12 {
	flex: 0 0 100%;
	max-width: 100%;
}

/*--procent col--*/

.col-10pr {
	flex: 0 0 10%;
	max-width: 10%;
}

.col-15pr {
	flex: 0 0 15%;
	max-width: 15%;
}

.col-20pr {
	flex: 0 0 20%;
	max-width: 20%;
}

.col-30pr {
	flex: 0 0 30%;
	max-width: 30%;
}

.col-35pr {
	flex: 0 0 35%;
	max-width: 35%;
}

.col-40pr {
	flex: 0 0 40%;
	max-width: 40%;
}

.col-45pr {
	flex: 0 0 45%;
	max-width: 45%;
}

.col-55pr {
	flex: 0 0 55%;
	max-width: 55%;
}

.col-60pr {
	flex: 0 0 60%;
	max-width: 60%;
}

.col-65pr {
	flex: 0 0 65%;
	max-width: 65%;
}

.col-70pr {
	flex: 0 0 70%;
	max-width: 70%;
}

.col-85pr {
	flex: 0 0 85%;
	max-width: 85%;
}

.col-85pr {
	flex: 0 0 85%;
	max-width: 85%;
}

.col-90pr {
	flex: 0 0 90%;
	max-width: 90%;
}

.col-grow {
	flex: 1 0 auto !important;
}

.col-auto {
	flex: 0 0 auto !important;
	width: auto !important;
}

/*---------------------------*/
/*----------- gap -----------*/
/*---------------------------*/

/*--10--*/

.flex.gap-10-10 {
	gap: 10px 10px;
}

.flex.gap-0-10 {
	gap: 0 10px;
}

.flex.gap-10-0 {
	gap: 10px 0;
}

.flex.gap-15-10 {
	gap: 15px 10px;
}

.flex.gap-10-15 {
	gap: 10px 15px;
}

.flex.gap-20-10 {
	gap: 20px 10px;
}

.flex.gap-10-20 {
	gap: 10px 20px;
}

.flex.gap-30-10 {
	gap: 30px 10px;
}

.flex.gap-10-30 {
	gap: 10px 30px;
}

.flex.gap-40-10 {
	gap: 40px 10px;
}

.flex.gap-10-40 {
	gap: 10px 40px;
}

/*--15--*/

.flex.gap-15-15 {
	gap: 15px 15px;
}

.flex.gap-0-15 {
	gap: 0 15px;
}

.flex.gap-15-0 {
	gap: 15px 10;
}

.flex.gap-20-15 {
	gap: 20px 15px;
}

.flex.gap-15-20 {
	gap: 15px 20px;
}

.flex.gap-30-15 {
	gap: 30px 15px;
}

.flex.gap-15-30 {
	gap: 15px 30px;
}

.flex.gap-40-15 {
	gap: 40px 15px;
}

.flex.gap-15-40 {
	gap: 15px 40px;
}

/*--20--*/

.flex.gap-20-20 {
	gap: 20px 20px;
}

.flex.gap-0-20 {
	gap: 0 20px;
}

.flex.gap-20-0 {
	gap: 20px 0;
}

.flex.gap-30-20 {
	gap: 30px 20px;
}

.flex.gap-20-30 {
	gap: 20px 30px;
}

.flex.gap-40-20 {
	gap: 40px 20px;
}

.flex.gap-20-40 {
	gap: 20px 40px;
}

/*--30--*/
.flex.gap-30-30 {
	gap: 30px 30px;
}

.flex.gap-0-30 {
	gap: 0 30px;
}

.flex.gap-30-0 {
	gap: 30px 0;
}

.flex.gap-40-30 {
	gap: 40px 30px;
}

.flex.gap-30-40 {
	gap: 30px 40px;
}

/*--40--*/
.flex.gap-40-40 {
	gap: 40px 40px;
}

.flex.gap-0-40 {
	gap: 0 40px;
}

.flex.gap-40-0 {
	gap: 40px 0;
}

/*---------------------------*/
/*------- positioning -------*/
/*---------------------------*/

@media screen and (max-width: 767px) {
	.flex.xs-w-space-between {
		justify-content: space-between;
	}

	.flex.xs-h-space-between {
		align-content: space-between;
	}

	.flex.xs-top-left {
		align-items: flex-start;
		justify-content: flex-start;
	}

	.flex.xs-top-center {
		align-items: flex-start;
		justify-content: center;
	}

	.flex.xs-top-right {
		align-items: flex-start;
		justify-content: flex-end;
	}

	.flex.xs-center-left {
		align-items: center;
		justify-content: flex-start;
	}

	.flex.xs-center-center {
		align-items: center;
		justify-content: center;
	}

	.flex.xs-center-right {
		align-items: center;
		justify-content: flex-end;
	}

	.flex.xs-bottom-left {
		align-items: flex-end;
		justify-content: flex-start;
	}

	.flex.xs-bottom-center {
		align-items: flex-end;
		justify-content: center;
	}

	.flex.xs-bottom-right {
		align-items: flex-end;
		justify-content: flex-end;
	}
}

@media screen and (min-width: 768px) {
	.flex.sm-w-space-between {
		justify-content: space-between;
	}

	.flex.sm-h-space-between {
		align-content: space-between;
	}

	.flex.sm-top-left {
		align-items: flex-start;
		justify-content: flex-start;
	}

	.flex.sm-top-center {
		align-items: flex-start;
		justify-content: center;
	}

	.flex.sm-top-right {
		align-items: flex-start;
		justify-content: flex-end;
	}

	.flex.sm-center-left {
		align-items: center;
		justify-content: flex-start;
	}

	.flex.sm-center-center {
		align-items: center;
		justify-content: center;
	}

	.flex.sm-center-right {
		align-items: center;
		justify-content: flex-end;
	}

	.flex.sm-bottom-left {
		align-items: flex-end;
		justify-content: flex-start;
	}

	.flex.sm-bottom-center {
		align-items: flex-end;
		justify-content: center;
	}

	.flex.sm-bottom-right {
		align-items: flex-end;
		justify-content: flex-end;
	}
}

@media screen and (min-width: 1024px) {
	.flex.md-w-space-between {
		justify-content: space-between;
	}

	.flex.md-h-space-between {
		align-content: space-between;
	}

	.flex.md-top-left {
		align-items: flex-start;
		justify-content: flex-start;
	}

	.flex.md-top-center {
		align-items: flex-start;
		justify-content: center;
	}

	.flex.md-top-right {
		align-items: flex-start;
		justify-content: flex-end;
	}

	.flex.md-center-left {
		align-items: center;
		justify-content: flex-start;
	}

	.flex.md-center-center {
		align-items: center;
		justify-content: center;
	}

	.flex.md-center-right {
		align-items: center;
		justify-content: flex-end;
	}

	.flex.md-bottom-left {
		align-items: flex-end;
		justify-content: flex-start;
	}

	.flex.md-bottom-center {
		align-items: flex-end;
		justify-content: center;
	}

	.flex.md-bottom-right {
		align-items: flex-end;
		justify-content: flex-end;
	}
}

.flex.w-space-between {
	justify-content: space-between;
}

.flex.h-space-between {
	align-content: space-between;
}

.flex.top-left {
	align-items: flex-start;
	justify-content: flex-start;
}

.flex.top-center {
	align-items: flex-start;
	justify-content: center;
}

.flex.top-right {
	align-items: flex-start;
	justify-content: flex-end;
}

.flex.center-left {
	align-items: center;
	justify-content: flex-start;
}

.flex.center {
	align-items: center;
	justify-content: center;
	text-align: inherit;
}

.flex.center-right {
	align-items: center;
	justify-content: flex-end;
}

.flex.bottom-left {
	align-items: flex-end;
	justify-content: flex-start;
}

.flex.bottom-center {
	align-items: flex-end;
	justify-content: center;
}

.flex.bottom-right {
	align-items: flex-end;
	justify-content: flex-end;
}

/*---------------------------*/
/*-------flex-carousel-------*/
/*---------------------------*/

@media screen and (max-width: 767px) {
	.xs-flex-carousel {
		display: flex;
		overflow-x: scroll;
		scroll-snap-type: x mandatory;
		padding: 0 20px;
		margin: 0 -20px;
		scroll-padding: 40px;
		gap: 20px;
		flex-wrap: nowrap;
	}

	.xs-flex-carousel::-webkit-scrollbar {
		display: none;
	}

	.xs-flex-carousel>* {
		flex: 0 0 var(--flex-carousel-item);
		max-width: initial;
		padding: 0 !important;
	}
}

@media screen and (min-width: 768px) {
	.sm-flex-carousel {
		display: flex;
		overflow-x: scroll;
		scroll-snap-type: x mandatory;
		scroll-padding: 40px;
		padding: 0 var(--gap-value-1);
		margin: 0 calc(var(--gap-value-1) - var(--gap-value-1) * 2);
		gap: calc(var(--gap-value-1) * 2);
		flex-wrap: nowrap;
	}

	.sm-flex-carousel::-webkit-scrollbar {
		display: none;
	}

	.sm-flex-carousel>* {
		flex: 0 0 auto;
		max-width: initial;
		padding: 0 !important;
	}
}

@media screen and (min-width: 1024px) {
	.md-flex-carousel {
		display: flex;
		overflow-x: scroll;
		scroll-snap-type: x mandatory;
		scroll-padding: 40px;
		padding: 0 var(--gap-value-1);
		margin: 0 calc(var(--gap-value-1) - var(--gap-value-1) * 2);
		gap: calc(var(--gap-value-1) * 2);
		flex-wrap: nowrap;
	}

	.md-flex-carousel::-webkit-scrollbar {
		display: none;
	}

	.md-flex-carousel>* {
		flex: 0 0 var(--flex-carousel-item);
		max-width: initial;
		padding: 0 !important;
	}
}

.flex-carousel {
	display: flex;
	overflow-x: scroll;
	scroll-snap-type: x mandatory;
	scroll-padding: 40px;
	gap: calc(var(--gap-value-1) * 2);
	flex-wrap: nowrap;
	padding: 0 var(--gap-value-1);
	margin: 0 calc(var(--gap-value-1) - var(--gap-value-1) * 2);
}

.flex-carousel::-webkit-scrollbar {
	display: none;
}

.flex-carousel.scroll::-webkit-scrollbar {
	display: block;
}

.flex-carousel>* {
	flex: 0 0 var(--flex-carousel-item);
	max-width: initial;
	padding: 0 !important;
}