#mainIsoRow >div:first-child{
	padding-left: clamp(50px, 10%, 116px);
}

.canvas__container{
	position: relative;
	min-height: 50vh;
}
.canvas__container > div{
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	width: 90%;
	position: absolute;
}

.canvas__container video{
	width: 100%;
}

.svg__container{
	z-index: 10;
}

.svg__container svg > g{
	scale: 0.96;
	translate: 56px 5px;
	position: relative;
	z-index: 1;
	pointer-events: bounding-box;
}

.svg__container svg > g g:not(:last-child){
	opacity: 0;
	transition: opacity 250ms ease;
}

.svg__container svg > g:hover g, .svg__container svg > g:has(:hover) g{
	opacity: 1;
	cursor: pointer;
}

circle{
	transition: opacity 750ms ease;
}

.svg__container svg > g:hover g circle, .svg__container svg > g:has(:hover) g circle{
	opacity: 0 !important;
}

.svg__container svg > g g:last-child > circle:last-child{
	animation-duration: 3s;
	animation-name: pulse;
	animation-iteration-count: infinite;
}

.svg__container svg > g g:last-child > circle:nth-child(2){
	animation-duration: 3s;
	animation-name: pulse2;
	animation-iteration-count: infinite;
}

@keyframes pulse{
	0% {r: 13;}
	50% {r: 15;}
	100% {r: 13;}
}

@keyframes pulse2{
	0% {r: 27; opacity: 1;}
	50% {r: 32; opacity: 0;}
	100% {r: 27; opacity: 1;}
}

.svg__container .manu{
	z-index: 10;
}

.svg__container .manu:hover{
	opacity: 1;
}

/* HOVER TO REVEAL TEXT */

.svg-text__container{
	z-index: 10;
	pointer-events: none;
	transform: none !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	position: relative !important;
}

.svg-text__container--mobile{
	z-index: 10;
	pointer-events: none;
	transform: none !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	position: relative !important;
}

.svg-text__container--mobile .svg__text{
	position: relative;
	top: 0;
	left: 0;
	display: none;
}

.svg-text__container--mobile .svg__text.active{
	display: block;
	opacity: 1;
}

.svg__text{
	opacity: 0;
    transition: opacity 250ms ease;
    max-width: 500px;
    padding: 30px 30px;
    background-color: rgba(7, 23, 37, 0);
    position: absolute;
    color: #FFF;
    left: 0;
    top: 40px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(2px);
	box-shadow: 0px 0px 40px 0px rgba(56,183,181,0.3);
}

.svg__text h4{
	color: #FFF;
    font-size: 20px;
    font-weight: 100;
    letter-spacing: 0px;
}

.svg__text p{
	line-height: 1.5em;
    margin-top: 10px;
    font-weight: 300;
    letter-spacing: 0.1px;
}

.svg__text.active{
	opacity: 1;
}

/* END OF HOVER TO REVEAL TEXT */

/* Mobile Iso Styles */

.mobile__iso-container{
	margin-top: 20px;
}

.iso__item{
	cursor: pointer;
}

.iso__item video{
	width: 100%;
}

.iso__text{
	margin-top: 20px;
}

.iso__text p{
	max-height: 185px;
	text-align: center;
	overflow-y: scroll;
	padding-inline: 40px;
	padding-top: 10px;
	color: #FFF;
}

.video__container{
	pointer-events: none;
}

/* END Mobile Iso Styles */

@media(max-width: 1500px){
	#mainIsoRow2 {
		padding-inline: 0 !important;
	}
	#mainIsoRow2 > div{
		width: 100% !important;
		padding: 0 !important;
	}
}

@media(max-width: 980px){
	.mobile__iso-container{
		margin-top: 0;
	}
	.canvas__container{
		overflow: scroll;
	}
	.svg__desktop{
		display: none;
	}
	/* Hide scrollbar for Chrome, Safari and Opera */
	.canvas__container::-webkit-scrollbar {
		display: none;
	}

	/* Hide scrollbar for IE, Edge and Firefox */
	.canvas__container {
		-ms-overflow-style: none;  /* IE and Edge */
		scrollbar-width: none;  /* Firefox */
		min-height: 500px;
	}
	.canvas__container > div{
		width: 100% !important;
		transform: none;
		top: 0 !important;
		left: 0 !important;
	}
	.svg__container, .video__container{
		min-width: 650px;
		transform-origin: 0 0;
	}
	#marginAdjust{
		margin-bottom: 30px !important;
	}
	#mainIsoRow {
		background: none !important;
	}
	#mainIsoRow2{
		padding-bottom: 200px !important;
		background-size: cover;
		background-position: -530px 20px;
	}
	#mainIsoRow {
		padding-inline: 0 !important;
	}
	#mainIsoRow >div:first-child{
		padding-left: 10% !important;
		padding-right: 10% !important;
	}

}