.websites .generator {
	display: grid; margin-top: 2rem;
	grid-template-columns: repeat(3, 1fr);
	grid-column-gap: 1rem;
	grid-row-gap: 1rem;
}
.websites .generator:not(:last-child) {margin-bottom: 2rem;}

.websites .generator .template {display: flex; flex-direction: column; gap: 1rem; justify-content: center;}
.websites .generator .template h5 {margin-bottom: 0; text-align: center;}
.websites .generator .template .preview {
	height: 400px; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .2); transition: background-position 2s ease;
	background-color: white; background-size: cover; background-position-y: 0;
}
.websites .generator .template:nth-child(1) .preview {background-image: url('../../../image/module/websites/example-1.png');}
.websites .generator .template:nth-child(2) .preview {background-image: url('../../../image/module/websites/example-2.png');}
.websites .generator .template:nth-child(3) .preview {background-image: url('../../../image/module/websites/example-3.png');}
.websites .generator .template .preview:hover {background-position-y: 100%;}

.websites .generator .template .button {margin-bottom: 0; font-size: 1rem;}
