/*  

	Author : Amedea
	Author URI : https://amedeapro.com
	Author : Moskva Yigit
	Author URI : http://moskvayigit.com
	Version : 0.0.3.9

	Table of Contents
	- On-Scroll Grid
	- Grid Defination
	 
*/

/*----------------------------
	.-- On-Scroll Grid
-----------------------------*/

.dark .grid--content__item-caption h3,
.dark .grid--content__item-caption span{
	color: var(--amedea--preset--color--black);
}

.light .grid--content__item-caption h3,
.light .grid--content__item-caption span{
	color: var(--amedea--preset--color--white);
}

.grid--content {
	width: 100%;
	grid-template-columns: repeat(8,1fr);
	grid-auto-rows: auto;
	display: grid;
	position: relative;
	margin: 0vh auto 50vh;
	overflow-y: hidden;
}

.grid--content__item {
    position: relative;
    margin: 5vw;
}

.grid--content__item-img {
	position: relative;
	overflow: hidden;
	display: grid;
	place-items: center;
	width: 100%;
	height: auto;
	aspect-ratio: 1.5;
}

.grid--content-v4 .grid--content__item-img {
	aspect-ratio: 1;
}

.grid--content__item-img-inner {
	width: 100%;
	height: 100%;
	background-position: 50%;
	background-size: cover;
	position: relative;
}

.grid--content__item-caption {
	position: absolute;
	padding: 0.5rem;
	display: grid;
	gap: 0.5rem;
}


.grid--content__item-caption h3 {
	font-weight: bold;
	margin: 0;
	margin: 2vw auto auto;
}

.grid--content__item-caption span {
	font-weight: bold;
}

@media screen and (max-width: 53em) {
	
	.grid--content {
		grid-template-columns: repeat(1,1fr);
		margin: 0vh auto 20vh;
	}
	
	.grid--content__item {
		grid-column: auto;
		grid-row: auto;
		margin: 15vw;
	}

	.grid--content__item-caption h3 {
		display: none;
	}

}

/*----------------------------
	.-- Grid Defination
-----------------------------*/


.grid--1-style--1{
	grid-row: 1;
	grid-column: 1 / span 4;
}

.grid--1-style--2{
	grid-row: 2;
	grid-column: 5 / span 3;
}

.grid--1-style--3{
	grid-row: 3;
	grid-column: 3 / span 2;
}

.grid--1-style--4{
	grid-row: 4;
	grid-column: 1 / span 2;
}

.grid--1-style--5{
	grid-row: 5;
	grid-column: 3 / span 5;
}

.grid--1-style--6{
	grid-row: 6;
	grid-column: 1 / span 2;
}

.grid--1-style--7{
	grid-row: 7;
	grid-column: 3 / span 3;
}

.grid--1-style--8{
	grid-row: 8;
	grid-column: 6 / span 2;
}

.grid--1-style--9{
	grid-row: 9;
	grid-column: 1 / span 5;
}

.grid--1-style--10{
	grid-row: 10;
	grid-column: 6 / span 3;
}

.grid--1-style--11{
	grid-row: 11;
	grid-column: 4 / span  2;
}

.grid--1-style--12{
	grid-row: 12;
	grid-column: 1 / span 3;
}

.grid--1-style--13{
	grid-row: 13;
	grid-column: 4 / span  5;
}

.grid--2-style--1{
	grid-row: 1;
	grid-column: 4 / span  3;
}

.grid--2-style--2{
	grid-row: 2;
	grid-column: 1 / span 3;
}

.grid--2-style--3{
	grid-row: 3;
	grid-column: 4 / span  4;
}

.grid--2-style--4{
	grid-row: 4;
	grid-column: 2 / span  2;
}

.grid--2-style--5{
	grid-row: 5;
	grid-column: 4 / span  3;
}

.grid--2-style--6{
	grid-row: 6;
	grid-column: 2 / span  2;
}

.grid--2-style--7{
	grid-row: 7;
	grid-column: 4 / span 3;
}

.grid--2-style--8{
	grid-row: 8;
	grid-column: 2 / span 2;
}

.grid--2-style--9{
	grid-row: 9;
	grid-column: 4 / span  4;
}

.grid--2-style--10{
	grid-row: 10;
	grid-column: 8 / span  1;
}

.grid--2-style--11{
	grid-row: 11;
	grid-column: 3 / span  5;
}

.grid--2-style--12{
	grid-row: 12;
	grid-column: 1 / span  2;
}

.grid--2-style--13{
	grid-row: 13;
	grid-column: 3 / span  5;
}

.grid--3-style--1{
	grid-row: 1;
	grid-column: 5 / span  4;
}

.grid--3-style--2{
	grid-row: 2;
	grid-column: 1 / span  4;
}

.grid--3-style--3{
	grid-row: 3;
	grid-column: 5 / span  4;
}

.grid--3-style--4{
	grid-row: 4;
	grid-column: 1 / span  4;
}

.grid--3-style--5{
	grid-row: 5;
	grid-column: 5 / span  4;
}

.grid--3-style--6{
	grid-row: 6;
	grid-column: 1 / span  4;
}

.grid--3-style--7{
	grid-row: 7;
	grid-column: 5 / span  4;
}

.grid--3-style--8{
	grid-row: 8;
	grid-column: 1 / span  4;
}

.grid--3-style--9{
	grid-row: 9;
	grid-column: 5 / span  4;
}

.grid--3-style--10{
	grid-row: 10;
	grid-column: 1 / span  4;
}

.grid--3-style--11{
	grid-row: 11;
	grid-column: 5 / span  4;
}

.grid--3-style--12{
	grid-row: 12;
	grid-column: 1 / span  4;
}

.grid--3-style--13{
	grid-row: 13;
	grid-column: 5 / span  4;
}

.grid--4-style--1{
	grid-row: 1;
	grid-column: 3 / span  2;
}

.grid--4-style--2{
	grid-row: 2;
	grid-column: 5 / span  2;
}

.grid--4-style--3{
	grid-row: 3;
	grid-column: 7 / span  2;
}

.grid--4-style--4{
	grid-row: 4;
	grid-column: 5 / span  2;
}

.grid--4-style--5{
	grid-row: 5;
	grid-column: 3 / span  2;
}

.grid--4-style--6{
	grid-row: 6;
	grid-column: 1 / span  2;
}

.grid--4-style--7{
	grid-row: 7;
	grid-column: 3 / span  2;
}

.grid--4-style--8{
	grid-row: 8;
	grid-column: 5 / span  2;
}

.grid--4-style--9{
	grid-row: 9;
	grid-column: 7 / span  2;
}

.grid--4-style--10{
	grid-row: 10;
	grid-column: 5 / span  2;
}

.grid--4-style--11{
	grid-row: 11;
	grid-column: 3 / span  2;
}

.grid--4-style--12{
	grid-row: 12;
	grid-column: 1 / span  2;
}

.grid--4-style--13{
	grid-row: 13;
	grid-column: 3 / span  2;
}