#works > div {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-column-gap: 30px;
		grid-row-gap: 30px;
		grid-auto-rows: min-content;
		max-width: 2048px;
	}
	
	
	#works > div > .tile {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
	}

	#works > div > .tile picture {
		aspect-ratio: 1 / 1;
		height: auto;
		width: 100%;
	}

	#works > div > .tile picture img {
		display: block;
		height: 100%;
		object-fit: cover;
		width: 100%;
	}
	
	#works > div > .tile label {
		border-bottom: 2px solid transparent;
		color: inherit;
		font-size: 1rem;
		font-weight: 600;
		margin: 1ch auto 10px 0px;
		padding-bottom: 3px;
		pointer: cursor;
		position: relative;
	}
	
	
	
	@media (min-width: 992px) {
		#works {
			margin-top: calc(3vw + 70px);
			padding-left: 3vw;
			padding-right: 3vw;
		}
	
		#works > div > .tile label {
			transition-duration: .3s;
			transition-property: color;
		}
		
		#works picture img {
			transition-duration: 1s;
			transition-property: transform;
		}

		
		#works a {
			color: var(--grey-heather);
		}
		
		#works a:hover {
			color: var(--muted);
			text-decoration: none;
		}
		
		#works a:hover .fdinln:after {
			opacity: 1;
			transform: translateY(2px);
		}
		
		#works a:hover picture img {
			transform: scale(1.1);
		}

		.fdinln {
			display: block;
			width: auto;
		}


		.fdinln:after {
			background-color: var(--muted);
			bottom: 0px;
			content: "";
			height: 2px;
			left: 0px;
			opacity: 0;
			position: absolute;
			width: 100%;
			transform: translateY(6px);
			transition-duration: .3s;
			transition-property: opacity, transform;
		}

	}
	
	
	
	@media (min-width: 1920px) {
		#works {	
			padding-left: 14vw;
			padding-right: 14vw;
		}
	}