.service-hero-container{
	padding-bottom: 225px;
	padding-top: 59px;

	@media(max-width:991.98px){
		padding-bottom: 120px;
	}

	@media(max-width:767.98px){
		padding-top: 39.5px;
		padding-bottom: 60px;
	}
}

.service-hero-container .hex-bg-container{
	width: 100vw;
	left:0;
	background-color:var(--white);
	background-size: 100%;
	background-position: 0px -50px;
	background-repeat:no-repeat;
	max-width: unset;
}

.service-hero-container .service-hero-bg-mobile{
	max-width:100vw;
	transform: translateX(-50%);
	left: 50%;
	background-color:var(--white);
    background-size: 190%;
    background-position: top center;
    background-repeat: no-repeat;


	@media(max-width:991.98px){
		max-height: 83.5%;
	}

	@media(max-width:767.98px){
		max-height: 85.5%;
	}

	@media(max-width:560px){
		max-height: 89%;
	}
}

.service-hero-container .digonal-bg-container{
	width: 200vw;
	left:-100vw;
	background: #0d2342; /* or use a gradient, image, or hex color */
	transform: skew(0deg, -10deg);
	height: 200px;
	color: white;
	position: relative;
	z-index: 1;
	max-width: unset;

	@media(max-width:767.98px){
		transform: skew(0deg, -8deg);
		height: 120px;`
	}
}

.service-hero-container .digonal-bg-container .bg-image{
	background-repeat: no-repeat;
	background-size: cover;
}

.service-hero-container .blog-tags{
	list-style: none;
	padding: 0;
	gap: 8px;
	margin-bottom: 14px;
}

.service-hero-container .blog-tags li{
	line-height: 1;
}

.service-hero-container .blog-tags .badge{
	font-family: "Hepta Slab", serif;
	font-size: 10px;
	font-style: normal;
	font-weight: 600;
	line-height: 16px;
	padding: 4px 12px;
	border-radius: 12px;
	background-color: var(--blue-4);
	color: var(--white);
}

.service-hero-container .heading-text, .service-hero-container .description-text{
	margin-bottom: 26px;
}

.service-hero-container .video-thumbnail{
	border-radius: 2px;
    filter: drop-shadow(2px 4px 6px rgba(0,0,0,.25));
	transform: translateY(20px);

	@media (max-width: 1199.98px) {
		transform: translateY(20px);
	}
}

.service-hero-container .open-video-cta {
    transform: translate3D(-50%, -50%, 0);
    left: 50%;
	top: 50%;
}


.service-hero-container .left-col {
	max-width: 580px;
	
	@media(max-width:991.98px){
		max-width: 100%;
	}
}

.service-hero-container .right-col {
	max-width: calc(100% - 580px);

	@media(max-width:991.98px){
		max-width: 100%;
	}
}

.service-hero-container .bg-transparent-white:not(.icon-only):not(:hover) {
	background: rgba(255, 255, 255, 0.70);
}

.service-hero-container .cta-button.primary.icon-only {
	box-shadow: inset 0 0 0 1px var(--green);
}

.service-hero-container .cta-button.primary.icon-only img {
	filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(155deg) brightness(96%) contrast(117%);
}

.service-hero-container .cta-button.primary.icon-only:hover img {
	filter: brightness(0) saturate(100%) invert(48%) sepia(49%) saturate(1345%) hue-rotate(123deg) brightness(94%) contrast(101%);
}

.service-hero-container .cta-button.secondary.icon-only img {
	filter: brightness(0) saturate(100%) invert(11%) sepia(7%) saturate(7186%) hue-rotate(173deg) brightness(91%) contrast(99%);
}

.service-hero-container .cta-button.secondary.icon-only:hover img {
	filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(155deg) brightness(96%) contrast(117%);
}

.service-hero-container .cta-button.icon-only .icon-img {
	margin-right: 0;
	max-height: 16px;
}