.job-card {
	height: 280px;
	position: relative;
}

.custom-hr {
	position: absolute;
	bottom: 40px;
	width: 90%;
	height: 0.2; /* Optional, default height */
	box-shadow: 0 0 0.4px black;
}

.posting-time {
	position: absolute;
	bottom: 0px;
	right: 12px;
}

.content .job-title-page {
	font-family: var(--font-family-h2);
	font-weight: var(--font-weight-h2);
	font-style: var(--font-style-h2);
	font-size: var(--font-size-h2);
	color: var(--color-h2);
}

.content .job-title-viewall {
	font-family: var(--font-family-h3);
	font-weight: var(--font-weight-h3);
	font-style: var(--font-style-h3);
	font-size: var(--font-size-h3);
	color: var(--color-h3);
}

.content .job-card {
	border: none;
}

.content .job-card span {
	font-family: var(--font-family-paragraph);
	font-weight: var(--font-weight-paragraph);
	font-style: var(--font-style-paragraph);
	font-size: var(--font-size-paragraph);
	color: var(--color-paragraph);
	letter-spacing: var(--letter-spacing-paragraph);
	line-height: var(--line-height-paragraph);
}

.content .job-card .job-attr-name {
	font-family: var(--font-family-paragraph);
	font-weight: 600;
	font-style: var(--font-style-paragraph);
	font-size: var(--font-size-paragraph);
	color: var(--color-h3);
	letter-spacing: var(--letter-spacing-paragraph);
	line-height: var(--line-height-paragraph);
	margin-bottom: 4px;
}

.content .job-card hr {
	margin: 0px 0px 4px 0px;
	padding: 0px;
}

.card {
	transition: background-color 0.3s ease, color 0.3s ease;
}

.card:hover {
	background-color: #048dd7;
	color: white;
}

.card:hover .job-title-viewall,
.card:hover .job-attr-name,
.card:hover .job-attr-name span,
.card:hover .posting-time,
.card:hover .posting-time span {
	color: white;
}

label,
input,
select,
option {
	font-family: var(--font-family-paragraph) !important;
	font-weight: var(--font-weight-paragraph) !important;
	font-style: var(--font-style-paragraph) !important;
	font-size: var(--font-size-paragraph) !important;
	letter-spacing: var(--letter-spacing-paragraph) !important;
	line-height: var(--line-height-paragraph) !important;
}

input,
select,
option {
	border-radius: 0px !important;
}

.content .page-item .page-link {
	border-radius: 0px;
}

.page-link.active,
.active > .page-link {
	background-color: #048dd7;
	border-color: #048dd7;
}

.page-link {
	color: #048dd7;
}

.page-item a {
	font-family: var(--font-family-paragraph) !important;
	font-weight: var(--font-weight-paragraph) !important;
	font-style: var(--font-style-paragraph) !important;
	font-size: var(--font-size-paragraph) !important;
	letter-spacing: var(--letter-spacing-paragraph) !important;
	line-height: var(--line-height-paragraph) !important;
}

#reset-btn {
	background-color: #737373;
	color: #f7f7f7;
	font-family: 'Metrophobic', serif;
	font-size: small;
	padding: 8px 12px;
	border-radius: 0px;
	font-family: var(--font-family-paragraph);
	font-style: var(--font-style-paragraph);
	font-weight: 280;
	border: none;
}

#reset-btn:hover {
	background-color: #b93342 !important;
}
