/* O5 Marine – Job Offers. Colours from the o5-marine theme. */

.o5jo-list h2 {
	scroll-margin-top: 140px;
}

.o5jo-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 24px;
	margin-bottom: 40px;
}

.o5jo-card {
	display: flex;
	flex-direction: column;
	background: #e9f1f3;
	border-left: 4px solid #005195;
	padding: 24px;
	color: #0f3c4c;
}

.content-career .o5jo-card h3 {
	font-size: 20px;
	margin: 0 0 15px;
}

.o5jo-card h3 a {
	color: #0f3c4c;
	text-decoration: none;
}

.o5jo-card h3 a:hover {
	color: #005195;
}

.content-career ul.o5jo-meta {
	list-style: none;
	padding: 0;
	margin: 0 0 20px;
}

.content-career ul.o5jo-meta li {
	font-size: 15px;
	line-height: 140%;
	margin-bottom: 6px;
	padding-left: 0;
}

.content-career ul.o5jo-meta li::before {
	display: none;
}

.o5jo-meta li span {
	display: inline-block;
	min-width: 110px;
	font-weight: 700;
	color: #005195;
}

.o5jo-btn {
	align-self: flex-start;
	margin-top: auto;
	background: #005195;
	border: 1px solid #005195;
	border-radius: 41px;
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	text-decoration: none;
	padding: 10px 28px;
}

.content-career .o5jo-card a.o5jo-btn {
	color: #fff;
}

.content-career .o5jo-card a.o5jo-btn:hover {
	background: transparent;
	color: #005195;
}

.content-career ul.o5jo-meta li {
	display: grid;
	grid-template-columns: 110px 1fr;
	column-gap: 10px;
}

.o5jo-draft {
	align-self: flex-start;
	background: #e6441a;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	padding: 2px 10px;
	margin-bottom: 10px;
}

.o5jo-empty,
.o5jo-spontaneous,
.o5jo-closed {
	font-size: 18px;
}

.o5jo-list a:not(.o5jo-btn),
.o5jo-single a {
	color: #005195;
}

.o5jo-closed {
	background: #fdece7;
	border-left: 4px solid #e6441a;
	padding: 16px 20px;
}

.content-career ul.o5jo-meta--single {
	background: #e9f1f3;
	padding: 24px;
	margin-bottom: 40px;
}

.o5jo-back {
	margin-bottom: 30px;
}

.o5jo-description {
	margin-bottom: 20px;
}

.o5jo-single .form-w {
	margin-top: 30px;
}

@media (max-width: 440px) {
	.o5jo-meta li span {
		display: block;
		min-width: 0;
	}
}

@media (max-width: 440px) {
	.content-career ul.o5jo-meta li {
		grid-template-columns: 1fr;
	}
}

/* Careers tab bar (Careers page, Open positions page, offer pages).
   Theme card style (ul.liste-ancre), four equal cards, text-column width. */
ul.liste-ancre.o5jo-tabs {
	max-width: 930px;
	flex-wrap: nowrap;
	margin: 0 auto;
}

.content-career ul.liste-ancre.o5jo-tabs {
	margin-bottom: 20px;
}

ul.liste-ancre.o5jo-tabs li {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
	padding: 0;
}

.content-career ul.liste-ancre.o5jo-tabs li::before {
	display: none;
}

/* Current page: orange underline (O5 accent). */
ul.liste-ancre.o5jo-tabs li.o5jo-active a {
	color: #e6441a;
	box-shadow: inset 0 -3px 0 #e6441a;
}

.o5jo-breadcrumb {
	font-size: 14px;
	color: #0f3c4c;
	margin: 0 0 40px;
}

.o5jo-breadcrumb a {
	color: #005195;
	text-decoration: none;
}

.o5jo-breadcrumb a:hover {
	text-decoration: underline;
}

.o5jo-breadcrumb [aria-current] {
	color: #e6441a;
}

.o5jo-breadcrumb .o5jo-sep {
	margin: 0 4px;
	color: #8aa0a8;
}

@media (max-width: 767px) {
	ul.liste-ancre.o5jo-tabs {
		flex-wrap: wrap;
		gap: 10px;
	}

	ul.liste-ancre.o5jo-tabs li {
		flex: 1 1 calc(50% - 10px);
	}
}

.content-career ul.liste-ancre.o5jo-tabs a,
.content-career .o5jo-breadcrumb a {
	text-decoration: none;
}

/* Banner on Open positions / offer pages: proportions of the vessel aerial photo
   (2000x406); other photos are cropped at the centre to fit. */
.o5jo-careers-section section#banner-cat img {
	aspect-ratio: 2000 / 406;
	height: auto;
	object-fit: cover;
	object-position: center;
}