.hero2 .wrapper {
	padding-left: 75px;
	padding-right: 75px;
}
.hero2-bg {
	width: calc(100% - 365px);
	padding-left: 40px;
}
.hero2-bg img {
	position: absolute !important;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	object-fit: cover;
}
.hero2-title {
	width: fit-content;
	background-color: #003767;
	padding: 50px;
	z-index: 19;
}
.hero2-title h1 {
	position: relative;
	width: fit-content;
	max-width: 220px;
	padding: 30px 0;
	margin: 0;
	color: #fff;
}
.hero2-title h1::after {
	position: absolute !important;
	content: '';
	bottom: 0;
	left: 0;
	width: 120px;
	height: 0;
	border-top: 1px solid #FAA519;
}
.hero2-cards {
	width: 365px;
	padding: 85px 80px;
	background-color: #fff;
}
.hero2-card {
	margin-bottom: 1.5rem;
	border-bottom: 1px solid #003767;
}
.hero2-card:last-child {
	margin-bottom: 0;
	border-bottom: 0;
}
.tablet-bg,
.tablet-bg img,
.mobile-bg,
.mobile-bg img  {
	position: absolute !important;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.tablet-bg img,
.mobile-bg img {
	object-fit: cover;
}
@media only screen and (max-width: 1080px) {
	.hero2 .wrapper { padding-left: 32px; padding-right: 32px; justify-content: space-between; }
	.tablet-bg { display: block !important; }
	.hero2-bg { padding-left: 0;}
	.hero2-bg img { display: none; }
	.hero2-cards { width: 325px; padding: 70px 60px; }
}
@media only screen and (max-width: 768px) {
	.hero2-title { padding: 45px 28px; }
}
@media only screen and (max-width: 600px) {
	.hero2 .wrapper { flex-direction: column; gap: 32px; padding-right: 32px; }
	.tablet-bg { display: none !important; }
	.mobile-bg { display: block !important; top: -133px; height: 480px; overflow: hidden; }
	.hero2-bg { width: 100%; }
	.hero2-title h1 { padding: 0 0 15px 0; font-size: 28px; max-width: 160px; }
	.hero2-cards { width: 100%; padding: 45px; }
}
@media only screen and (max-width: 480px) {
	.mobile-bg { top: -104px; }
	.hero2 .wrapper { padding-left: 24px;padding-right: 24px; }
}