@import '../../../Components/GlobalStyles/colors.scss';

.tableHeading {
	background-color: rgba(144, 190, 4, 0.13) !important;
	color: var(--bs-body-color);
}

.middleRow {
	p {
		width: 240px;
		text-align: center;
	}
}

.sub {
	padding: 0 !important;

	&.left {
		small {
			margin-left: 15px;
			margin-right: auto;
		}
	}
}

.zigZag {
	color: $red !important;
}

.funding {
	position: relative;
	font-size: 0.725rem;
	color: $font-grey;

	&:before {
		content: '';
		position: absolute;
		top: 0px;
		margin-left: -14px;
		width: 10px;
		height: 10px;
		border-radius: 10px;
		background-color: var(--primary-color);
	}

	&.red {
		// color: $red;

		&:before {
			background-color: $red;
		}
	}
}

.snippet {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	background-color: $light-grey;
	padding: 20px;
	font-size: 0.725rem;
	width: 100%;

	&::before {
		content: '» ';
		position: absolute;
		color: var(--primary-color);
		top: 12px;
		left: 8px;
		font-size: 1.25rem;
	}

	h5 {
		display: block;
		width: 100%;
		font-size: 0.8rem;
		color: var(--primary-color);
	}

	p {
		white-space: initial !important;
	}

	&.red {
		background-color: $background-red;

		&::before {
			color: $red;
		}

		h5 {
			color: $red;
		}
	}
}