.TABLE {
	position: relative;
	max-width: 100%;
}

.TABLE .head {
	padding-bottom: var(--s5);
}

.TABLE .head .b-columns {
	justify-content: space-between;
}

.TABLE h3 {font-size: 24rem;}

.TABLE .head .b-column[data-width="1/6"] .b-button {
	padding: 20rem var(--s3);
}

.TABLE table {
	margin: 0;
	word-break: break-word;
}

.TABLE th {
	width: var(--col-6);
    border: 1px solid var(--blue);
    border-width: 1rem 0;
    padding: var(--s2) var(--s3);
}

.TABLE td:first-child {
	width: var(--col-10);
}

.TABLE td {
	width: var(--col-6);
	border-color: var(--midnight-60);
	padding: var(--s3) var(--s7) var(--s3) var(--s3);
}

.TABLE tr:last-child td {
	border-width: 1rem 0;
}


.TABLE th:last-child, .TABLE td:last-child {
	padding-right: 0 !important;
}

.TABLE th {
	text-align: left;
	font-weight: 500;
	background: var(--midnight-300);
	text-wrap: balance;
}

.TABLE th h5,
.TABLE th p {
	max-width: var(--col-10);
	padding: 0 var(--s3);
}

.TABLE .container {
	outline: none !important;
	display: flex;
	align-items: center;
}

.TABLE .tooltip {
	position: relative;
}

.TABLE .tooltip .icon {
	width: var(--s3);
	height: var(--s3);
	background: url(ui-info.svg) no-repeat center / 100%;
	margin: 0 0 0 var(--s1);
}

.TABLE .tooltip .text {
	z-index: 1;
	position: absolute;
	bottom: var(--s1);
	left: var(--s6);
	width: var(--col-3);
	padding: var(--s2) var(--s3);
	background: var(--midnight-200);
	color: var(--white);
	font-size: 16rem;
	border-radius: var(--s1);
	border: 1px solid var(--midnight-100);
	opacity: 0;
	transform: translate(calc(var(--s5) * -1), 0);
	transition: opacity 0.25s, transform 0.25s;
	pointer-events: none;
}

.TABLE .tooltip .text {
	z-index: 1;
	position: absolute;
	bottom: var(--s1);
	left: var(--s6);
	width: var(--col-3);
	padding: var(--s2) var(--s3);
	background: var(--midnight-200);
	color: var(--white);
	font-size: 16rem;
	border-radius: var(--s1) var(--s1) var(--s1) 0;
	border: 1px solid var(--midnight-100);
	opacity: 0;
	transform: translate(calc(var(--s5) * -1), 0);
	transition: opacity 0.25s, transform 0.25s;
	pointer-events: none;
}


.TABLE .tooltip .text::before {
	content: '';
	position: absolute;
	bottom: -6px;
	left: -6rem;
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-top-color: var(--midnight-200);
	transform: rotate(-45deg);
	z-index: 1;
}

.TABLE .tooltip .text::after {
	content: '';
	position: absolute;
	bottom: -9px;
	left: -8rem;
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-top-color: var(--midnight-100);
	transform: rotate(-45deg);
	z-index: 0;
}


.TABLE .container:focus-within .tooltip .text {
	opacity: 1;
	transform: translate(0, 0);
}

@media screen and (min-width: 961px) {
	.TABLE .b-sticky {
		position: sticky;
		top: 0;
		background: var(--midnight-blue);
		z-index: 1;
	}
	.b-page[data-scroll="up"] .TABLE .b-sticky {top: var(--s8);}

	.TABLE .b-buttons .b-button {font-size: 18rem; margin: 22rem 0 0; width: 100%; padding: 14rem var(--s1); }
}

@media screen and (max-width: 960px) {
	.TABLE .b-sticky {position: sticky; top: 0; z-index: 1;}
	.b-page[data-scroll="up"] .TABLE .b-sticky {position: sticky; top: var(--s8);}
	.TABLE .head .b-buttons {display: none;}
	.TABLE .head .b-column:first-child {display: none;}
	.TABLE .head :is(p, .b-spacer) {display: none;}
	.TABLE h3 {font-size: 16rem;}
	.TABLE .head {padding-bottom: 0;margin-bottom: var(--s6);border-bottom: 1px solid var(--teal);background: var(--midnight-blue);}
	.TABLE .head .b-columns {justify-content: initial;}
	.TABLE .head .b-column {width: 30%;}
	.TABLE .head .content {padding: 0;}
	.TABLE tr {display: flex; flex-wrap: wrap;}
	.TABLE td:first-child {width: -webkit-fill-available;border-width: 0;}
	.TABLE td {width: 33%;padding: var(--s3) 0;border-width: 0 0 1rem 0;}
	.TABLE tr:last-child td {border-width: 0;}
	.TABLE th {width: -webkit-fill-available;}
	.TABLE .tooltip .text {width: var(--col-1);}
	.TABLE .tooltip .text::before {left: -6rem;}
	.TABLE .tooltip .text::after {left: -8rem;;}

}
