.gr-t3 .shiftrow {
	gap: 0
}

.gr-t1 .img1,
.gr-t1 .img2,
.gr-t1 figure {
	-ms-flex-item-align: center;
	align-self: center;
	height: auto;
	margin: 0;
	padding: 0;
	width: 100%;
	z-index: 1
}

.gr-t1 img {
	height: auto;
	width: 100%
}

.gr-t1 .txt1,
.gr-t1 .txt2 {
	-ms-flex-item-align: center;
	align-self: center;
	background-color: #fff;
	padding: 1rem 2rem;
	text-align: center;
	width: 100%;
	position: relative;
}

.gr-t1 .is-layout-flex {
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center
}

.gr-t4 figure {
	margin: 0
}

.gr-t4 .txt1 {
	background-color: var(--light);
	color: var(--text);
	padding: 10%
}

.gr-t4 .img1 {
	height: 100%
}

.gr-t4 .img1 img {
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover
}

@media screen and (min-width:768px) {
	.gr-t1 {
		display: grid;
		gap: 0 0;
		grid-template-columns: 1fr .5fr .5fr 1fr;
		grid-template-rows: .5fr 3fr .5fr
	}

	.gr-t1 .txt1 {
		grid-area: 1/4/4/5
	}

	.gr-t1 .txt2 {
		grid-area: 1/1/4/2
	}

	.gr-t1 .img2 {
		grid-area: 2/2/3/5
	}

	.gr-t1 .img1 {
		grid-area: 2/1/3/4
	}

	.gr-t1 .bg2 {
		grid-area: 1/1/4/4
	}

	.gr-t1 .bg1 {
		grid-area: 1/2/4/5
	}

	.gr-t1 .img1 {
		justify-self: end
	}

	.gr-t1 .img2 {
		justify-self: start
	}

	.gr-t1 .bg1,
	.gr-t1 .bg2 {
		background-color: #fff;
		height: 100%;
		width: 100%
	}

	.gr-t1 .txt1,
	.gr-t1 .txt2 {
		background-color: transparent;
		justify-self: center
	}

	.gr-t3 {
		margin-top: 300px !important;
		padding: 1px
	}

	.gr-t3 .shiftrow {
		gap: 0;
		margin-top: -300px !important
	}

	.gr-t2 {
		display: grid;
		gap: 0 1em;
		grid-auto-flow: row;
		grid-template-areas: "img1 txt1""img1 img2""txt2 img2";
		grid-template-columns: 1fr 1fr;
		max-width: 960px !important;
		margin:0 auto;
	}

	.gr-t2 .img1 {
		align-self: start;
		grid-area: img1
	}

	.gr-t2 .txt1 {
		grid-area: txt1;
		justify-self: start;
		text-align: left;
		width: 100%
	}

	.gr-t2 .img2 {
		align-self: end;
		grid-area: img2
	}

	.gr-t2 .txt2 {
		align-self: end;
		grid-area: txt2;
		justify-self: end;
		text-align: right;
		width: 100%
	}

	.gr-t4 {
		display: grid;
		gap: 0 0;
		grid-auto-flow: row;
		grid-template-columns: 1fr .5fr .5fr;
		grid-template-rows: .5fr 1fr .5fr
	}

	.gr-t4 .img1 {
		align-self: center;
		grid-area: 1/1/4/3;
		justify-self: start;
		z-index: 0
	}

	.gr-t4 .txt1 {
		align-self: center;
		-webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .4);
		box-shadow: 0 0 2px rgba(0, 0, 0, .4);
		grid-area: 2/2/3/4;
		justify-self: end;
		z-index: 1
	}

	.gr-t4.left {
		grid-template-columns: .5fr .5fr 1fr
	}

	.gr-t4.left .img1 {
		grid-area: 1/2/4/4;
		justify-self: end
	}

	.gr-t4.left .txt1 {
		grid-area: 2/1/3/3;
		justify-self: start
	}
}

.scroll-indicator {
    position: absolute;
    bottom: 90px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    z-index: 10;
	border-radius: 5px;
	padding: 5px;
}

.scroll-indicator a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: #fff;
}

.scroll-indicator a svg {
    animation: bounce 2s infinite;
    filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.8));
}

.scroll-indicator span {
    font-size: 0.7rem;
    color: white;
    text-shadow: 0 0 3px rgba(0, 0, 0, 0.8);
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-10px);
    }
    60% {
        transform: translateY(-5px);
    }
}

@media screen and (max-width: 768px) {
    .scroll-indicator {
        display: none;
    }
}