main {
	display: flex;
	flex-direction: column;
	gap: 100px;
	justify-content: center;
	margin: 0 auto;
}

h1 {
	font-size: 3rem;
	font-family: monospace;
	text-align: center;
	margin: 150px 0 0;
	padding: 5px;
	color: #fff;
	/*background-color: #039cdf;*/
	background: url(/src/images/plank_cropped.png);
	box-shadow: 0 0 10px 0 rgba(0,0,0,0.5), 
		inset 0 0 5px 5px rgba(0,0,0,0.2);
	
	text-shadow: 0 0 2px rgba(0,0,0,0.7);
}
@media only screen and (max-width: 800px) {
	h1 {
		font-size: 2.5rem;
	}
}
@media only screen and (max-width: 550px) {
	h1 {
		font-size: 2rem;
	}
}

.stores {
	max-width: 1000px;
	padding: 20px;
	/*
	background-image: linear-gradient(
    to top right,
    rgba(3, 156, 223, 1) 30%,
    rgba(3, 156, 223, 0.5) 150%
  );
		*/
  box-sizing: border-box;
	
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin: auto;
	/*margin: 300px 0 0 0;*/
	background: url(/src/images/plank_cropped.png);
	box-shadow: 0 0 10px 0 rgba(0,0,0,0.5), 
		inset 0 0 5px 5px rgba(0,0,0,0.2);
	
	text-shadow: 0 0 2px rgba(0,0,0,0.7);
}
@media only screen and (max-width: 300px) {
	.stores {
		padding: 20px 5px;
	}
}
.stores figure {
	/*background-color: #fff;*/
	flex: 1 1 280px;
  max-width: 300px;
	margin: auto;
	/*height: 100px;*/
	color: #fff;
	box-sizing: border-box;
	border: solid 1px #fff;
	border-radius: 10px;
	transition: border 0.15s ease;
}
.stores figure:hover {
	border: solid 1px #000;
}
.stores h2 {
	text-align: center;
}
.stores figure ul {
	list-style: none;
	padding: 10px;
	line-height: 1.5;
}




.stores .images {
  min-width: 50%;
	max-width: 1000px;
	flex: 0 1 400px;
	/*margin: auto;*/
	
	/*max-height: 100px;*/
}
@media only screen and (max-width: 650px) {
	.stores .images {
		margin: 0 auto;
	}
}
.stores .image-viewport {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
  width: 100%;
  box-sizing: border-box;
  padding-bottom: 5px;
	border-radius: 10px;
}
.stores .image-track {
  display: flex;
  padding: 0;
  margin: 0;
  list-style: none;
	gap: 5px;
}
.stores .image-item {
  flex: 0 0 100%;
  scroll-snap-align: start;
  position: relative;
}
.stores .image-item img {
  width: 100%;
	height: 150px;
	/*max-height: 150px;*/
  /*height: 300px;*/
  object-fit: cover;
  display: block;
  border-radius: 10px;
}
/* hide scrollbar (Webkit) */
.stores .image-viewport::-webkit-scrollbar { height: 8px; }
.stores .image-viewport::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.2); border-radius: 6px; }
