.grid__item-img {
	display: block;
	height: 100%;
	width: 100%;
}

.grid__item-img canvas {
	height: 100%;
}

.grid__item-img img {
	height: 100%;
	display: block;
}

.grid__item-img img:nth-child(2) {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity 0.3s;
}

.grid__item:hover .grid__item-img img:nth-child(2) {
	opacity: 1;
}

.js .grid__item-img img {
	display: none;
}




@media screen and (min-width: 50em) {
	
	.grid__item {
		height: 50vmax;
		width: 100%;
	}
	.grid__item-subtitle * {
		opacity: 0;
		transform: translate3d(100px, 0, 0);
		transition: all 0.5s cubic-bezier(0.2, 1, 0.7, 1);
		transition-property: transform, opacity;
	}
	.grid__item:hover .grid__item-subtitle * {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
	.grid__item:hover .grid__item-subtitle span {
		transition-delay: 0.1s;
	}
	.grid__item:hover .grid__item-subtitle .grid__item-link {
		transition-delay: 0s;
	}
	.grid__item-title {
		font-size: 6vw;
	}
	.grid__item-title--small {
		font-size: 3vw;
	}
	.grid__item-text {
		margin-top: 2.5rem;
	}
}