@charset "utf-8";

body { margin: 0; color: #000; text-align: center; }

@font-face {
	font-family: "Saniretro Regular";
	src:url("./Saniretro.eot?") format("eot"),
	url("./Saniretro.woff") format("woff"),
	url("./Saniretro.ttf") format("truetype"),
	url("./Saniretro.svg#SaniretroRegular") format("svg");
	font-weight: normal; font-style: normal;
}

#body { min-height: 100%; font-family: "Saniretro Regular"; }

/* #8ca8a9;*/
a:link,a:visited,a:hover,a:active { text-decoration: none; color: #000; }

h1 { margin: 5% 0 0 0; }
h1 img { max-width: 100%; padding: 0.1em; }

nav { width: 100%; }
nav ul { padding: 0; }
nav ul li { display: inline-block; list-style-type: none; font-size: 1.8em; margin-bottom: 0.3em; }

#products { width: 65%; margin : 0 auto; }
#products ol { padding: 0; }
#products ol li { display: inline-block; list-style-type: none; }
#products ol li.soldout { position:	relative; }
#products ol li.soldout img { filter: opacity(30%); }
#products ol li.soldout span { position: absolute; left: 50%; top: 0; color: #F26964; }

.address { margin-top: 2em; font-size: 1.5em; }

footer { width: 100%; }
footer p { margin: 0; }

@media screen and (max-width:500px) {

h1 { margin: 0; }
h1 img { height: 100%; max-width: 30%; padding-top: 0.3em; }

.select,
.address,
footer,
nav ul li { font-size: 0.6em; }

#products { width: 100%; }
#products img { width: 60px; }
#products ol li.soldout span { font-size: 90%; }

}