22

✏️ Editing: _jet-satellite.scss

.jet-satellite-widget {
		position: relative;
		z-index: 1;
}

.jet-tricks-satellite {
	position: absolute;
	pointer-events: none;
	transform-origin: 50% 50%;
	z-index: 2;

.jet-tricks-satellite__text,
	.jet-tricks-satellite__icon,
	.jet-tricks-satellite__image {
		.jet-tricks-satellite__link {
			pointer-events: auto;
			cursor: pointer;
		}
	}

.jet-tricks-satellite__text {
		font-size: 60px;
		font-weight: 600;
		color: #6ec1e4;
		transform: translateX(-50%) translateY(-50%);

span {
			display: block;
			white-space: nowrap;
			transform-origin: 50% 50%;
		}
	}

.jet-tricks-satellite__icon {
		position: relative;
		transform: translateX(-50%) translateY(-50%);

.jet-tricks-satellite__icon-instance {
			position: relative;

display: flex;
			justify-content: center;
			align-items: center;
			width: 40px;
			height: 40px;
			border-radius: 50px;
			color: #fff;
			background-color: #6ec1e4
		}
	}

.jet-tricks-satellite__image {
		position: relative;
		transform: translateX(-50%) translateY(-50%);

.jet-tricks-satellite__image-instance {
			width: 100%;
			height: 100%;
			display: block;
			object-fit: cover;
			transform-origin: 50% 50%;
		}
	}

&--top-left {
		top: 0;
		left: 0;
	}

&--top-center {
		top: 0;
		left: 50%;
	}

&--top-right {
		top: 0;
		left: 100%;
	}

&--middle-left {
		top: 50%;
		left: 0;
	}

&--middle-center {
		top: 50%;
		left: 50%;
	}

&--middle-right {
		top: 50%;
		left: 100%;
	}

&--bottom-left {
		top: 100%;
		left: 0;
	}

&--bottom-center {
		top: 100%;
		left: 50%;
	}

&--bottom-right {
		top: 100%;
		left: 100%;
	}
}

MR SKB