$o-ti-bp1: 800;

.o-ti {
	@include mq($o-ti-bp1) {
		display: flex;
		justify-content: space-between;
	}
}

.o-ti--reversed {
	@include mq($o-ti-bp1) {
		flex-direction: row-reverse;
	}
}


.o-ti__image {
	@include mq($o-ti-bp1) {
		align-self: center;
		flex: none;
		width: calc(50% - #{column(0.5)});
	}
}


.o-ti__image {
	position: relative;

	&::before {
		content: '';
		position: absolute;
		z-index: -1;
		bottom: 24px;
		left: -60px;
		width: 88px;
		height: 88px;
		background-image: url(/img/plane-ornament-1.svg);
	}
}


.o-ti__text {
	@include mq($max: $o-ti-bp1) {
		margin-top: space(4);
	}

	@include mq($o-ti-bp1) {
		flex: none;
		width: calc(50% - #{column(0.5)});
	}
}