.ellipsis {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.flex {
	display: flex;
}
.flex-1 {
	flex: 1;
}
.flex-center {
	@extend .flex;
	justify-content: center;
	align-items: center;
}

.flex-between {
	@extend .flex;
	justify-content: space-between;
	align-items: center;
}

.flex-around {
	@extend .flex;
	justify-content: space-around;
	align-items: center;
}

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

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

.flex-around {
	@extend .flex;
	justify-content: space-around;
	align-items: center;
}

.flex-wrap {
	@extend .flex;
	flex-wrap: wrap;
}

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

.fullWH {
	width: 100%;
	height: 100%;
}

.w100 {
	width: 100%;
	padding: 0 20px;
	box-sizing: border-box;
}

/*
  gap
*/
@for $i from 0 through 1000 {
	.gap-#{$i} {
		gap: #{$i}px;
	}
}

/*
  width
*/
@for $i from 0 through 1000 {
	.w-#{$i} {
		width: #{$i}+ "%";
	}

	.w-p-#{$i} {
		width: #{$i}px;
	}
}

/*
    height
  */
@for $i from 0 through 100 {
	.h-#{$i} {
		height: #{$i}+ "%";
	}
}
@for $i from 0 through 1000 {
	.h-p-#{$i} {
		height: #{$i}px;
	}
}

/*
    margin
  */
@for $i from 0 through 100 {
	.margin-#{$i} {
		margin: #{$i}px;
	}
	.margin-t-#{$i} {
		margin-top: #{$i}px;
	}
	.margin-b-#{$i} {
		margin-bottom: #{$i}px;
	}
	.margin-l-#{$i} {
		margin-left: #{$i}px;
	}
	.margin-r-#{$i} {
		margin-right: #{$i}px;
	}
}

/*
    padding
  */
@for $i from 0 through 100 {
	.padding-#{$i} {
		padding: #{$i}px;
	}
	.padding-t-#{$i} {
		padding-top: #{$i}px;
	}
	.padding-b-#{$i} {
		padding-bottom: #{$i}px;
	}
	.padding-l-#{$i} {
		padding-left: #{$i}px;
	}
	.padding-r-#{$i} {
		padding-right: #{$i}px;
	}
}

::-webkit-scrollbar {
	width: 6px !important;
	height: 6px !important;
	background-color: transparent;
	border-radius: 0;
	width: 0 !important;
	background-color: transparent !important;
}

::-webkit-scrollbar-thumb {
	border-radius: 6px;
	background-color: rgba(76, 169, 206, 0.5);
}
