.ellip {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ellip_line_1 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.ellip_line_2 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.ellip_line_3 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.ellip_line_4 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 4; -webkit-box-orient: vertical;}
.ellip_line_5 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; /* number of lines to show */ -webkit-line-clamp: 5; -webkit-box-orient: vertical;}

.hidden { display: none }

.flex { display: flex; }
.flex-row { flex-direction: row; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.flex-nowrap { flex-wrap: nowrap; }

@media (max-width: 840px) {
	.md-flex-col {
		flex-direction: column;
	}
}

.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.basis-0 { flex-basis: 0px; }
.basis-1 { flex-basis: 0.25rem; }
.basis-2 { flex-basis: 0.5rem; }
.basis-3 { flex-basis: 0.75rem; }
.basis-4 { flex-basis: 1rem; }
.basis-5 { flex-basis: 1.25rem; }
.basis-6 { flex-basis: 1.5rem; }
.basis-7 { flex-basis: 1.75rem; }
.basis-8 { flex-basis: 2rem; }

.basis-1-12	{ flex-basis: 8.333333%; }
.basis-2-12	{ flex-basis: 16.666667%; }
.basis-3-12	{ flex-basis: 25%; }
.basis-3-13	{ flex-basis: 31.5%; }
.basis-4-12	{ flex-basis: 33.333333%; }
.basis-5-12	{ flex-basis: 41.666667%; }
.basis-6-12	{ flex-basis: 50%; }
.basis-7-12	{ flex-basis: 58.333333%; }
.basis-8-12	{ flex-basis: 66.666667%; }
.basis-9-12	{ flex-basis: 75%; }
.basis-10-12 { flex-basis: 83.333333%; }
.basis-11-12 { flex-basis: 91.666667%; }
.basis-full { flex-basis: 100%; }

.m-0 { margin: 0px}
.ml-1 { margin-left: 0.25rem; }
.ml-2 { margin-left: 0.5rem; }
.ml-3 { margin-left: 0.75rem; }
.ml-4 { margin-left: 1rem; }
.ml-5 { margin-left: 1.25rem; }
.ml-6 { margin-left: 1.5rem; }
.ml-7 { margin-left: 1.75rem; }
.ml-8 { margin-left: 2rem; }

.mr-1 { margin-right: 0.25rem; }
.mr-2 { margin-right: 0.5rem; }
.mr-3 { margin-right: 0.75rem; }
.mr-4 { margin-right: 1rem; }
.mr-5 { margin-right: 1.25rem; }
.mr-6 { margin-right: 1.5rem; }
.mr-7 { margin-right: 1.75rem; }
.mr-8 { margin-right: 2rem; }

.mt-1 {	margin-top: 0.25rem}
.mt-2 {	margin-top: 0.5rem}
.mt-3 { margin-top: 0.75rem}
.mt-4 {	margin-top: 1rem}
.mt-5 {	margin-top: 1.25rem}
.mt-6 {	margin-top: 1.5rem}
.mt-7 { margin-top: 1.75rem}
.mt-8 {	margin-top: 2rem}

.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-5 { margin-bottom: 1.25rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-7 { margin-bottom: 1.75rem; }
.mb-8 { margin-bottom: 2rem; }

.p-0 { padding: 0px; }
.pl-1 {	padding-left: 0.25rem}
.pl-2 {	padding-left: 0.5rem}
.pl-3 {	padding-left: 0.75rem}
.pl-4 {	padding-left: 1rem}
.pl-5 {	padding-left: 1.5rem}


.pr-1 {	padding-right: 0.25rem}
.pr-2 {	padding-right: 0.5rem}
.pr-3 {	padding-right: 0.75rem}
.pr-4 {	padding-right: 1rem}
.pr-5 {	padding-right: 1.5rem}

.pt-1 {	padding-top: 0.25rem}
.pt-2 {	padding-top: 0.5rem}
.pt-3 { padding-top: 0.75rem}
.pt-4 {	padding-top: 1rem}
.pt-5 {	padding-top: 1.5rem}

.pb-1 {	padding-bottom: 0.25rem}
.pb-2 {	padding-bottom: 0.5rem}
.pb-3 {	padding-bottom: 0.75rem}
.pb-4 {	padding-bottom: 1rem}
.pb-5 {	padding-bottom: 1.5rem}

.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-5 { gap: 1.25rem; }
.gap-6 { gap: 1.5rem; }
.gap-7 { gap: 1.75rem; }
.gap-8 { gap: 2rem; }
.gap-9 { gap: 2.5rem; }
.gap-10 { gap: 2.75rem; }
.gap-11 { gap: 3rem; }


.font-extrathin {font-weight: 100}
.font-semithin {font-weight: 200}
.font-thin {font-weight: 300}
.font-normal {font-weight: 400}
.font-mediumn {	font-weight: 500}
.font-semibold { font-weight: 600}
.font-extrabold { font-weight: 800}

.cursor_pointer { cursor: pointer}
.cursor-default { cursor: default}

.w-1-12 { width: 8.333333%; }
.w-2-12 { width: 16.666667%; }
.w-3-12 { width: 25%; }
.w-4-12 { width: 33.333333%; }
.w-5-12 { width: 41.666667%; }
.w-6-12 { width: 50%; }
.w-7-12 { width: 58.333333%; }
.w-8-12 { width: 66.666667%; }
.w-9-12 { width: 75%; }
.w-10-12 { width: 83.333333%; }
.w-11-12 { width: 91.666667%; }
.w-full { width: 100% }

.grid { display: grid }
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
.grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); }
.grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); }
.grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); }

.items-center { align-items: center; }
.items-start { align-items: start; }
.items-end { align-items: end; }
.justify-center { justify-content: center; }
.justify-start { justify-content: start; }
.justify-end { justify-content: end; }

.border-t-1 { border-top: 1px solid var(--color-gray_03) }
.border-b-1 { border-bottom: 1px solid var(--color-gray_03) }
.border-l-1 { border-left: 1px solid var(--color-gray_03) }
.border-r-1 { border-right: 1px solid var(--color-gray_03) }

.border-r-1 { border-radius:1rem;}
.border-r-2 { border-radius:2rem;}
.border-r-3 { border-radius:3rem;}
.border-r-4 { border-radius:4rem;}