/* harlem one stop festival of food 2021 */
	
	@import url('https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:ital,wght@0,300;0,700;1,300&display=swap');
	
	/* resets */

   *, *::before, *::after { box-sizing: border-box; }
   html { height: 100%; -webkit-text-size-adjust: 100%; }
   body { margin: 0; padding: 0; height: 100%; scroll-behavior: smooth; text-rendering: optimizeSpeed; }   
	body > footer { position: sticky; top: 100vh; }
   table { border: 0; padding: 0; border-spacing: 0px; border-collapse: collapse; }
   sup, sub { vertical-align: baseline; position: relative; top: -0.4em; }
   sub { top: 0.4em; }
   img { vertical-align: bottom; max-width: 100%; display: block; }
   input, button, textarea, select { font: inherit; }
	
	/* type */
	
	body { font: 700 21px/1.4 'Open Sans Condensed', sans-serif; }
	h4 { font: 700 32px/1.2 'Open Sans Condensed', sans-serif; margin: 0; padding: 0; }
	b { font-weight: 700; }
	.warm { color: #C3161C; }
	a { color: 	#C3161C; text-decoration: none; }
	a:hover { color: #CAA705; }	
	a.btn { background-color: #C3161C; color: #FFFFFF; border: 0; padding: 8px 18px; display: inline-block; white-space: nowrap; }
	a.btn:hover { color: #FFFFFF; background-color: #CAA705; }	
	
	/* structure */
	
	body { background: #DFD5CE url('images/bg.jpg') center center repeat-y; background-size: 100% auto; color: #000000; }
	.container { width: 100%; text-align: center; }
	.frame { width: 100%; max-width: 1400px; padding: 30px 100px; margin: 0 auto; }
	#topbar { display: block; background: #000000 url('/images/h1s-10years.jpg') right center no-repeat; background-size: auto 100%; text-align: right; }
	#topbar .hum { padding: 5px 5px 5px 50px; background: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,0.5) 20%); display: inline-block; }
	#topbar img { display: inline-block; height: 38px; width: auto; }
	footer img { width: 100%; height: auto; display: block; }
	.imgstrip { margin: 50px 0; }
	.imgstrip img { width: 100%; height: auto; display: block; }
	.fof { text-align: center; margin: 50px 0; }
	.fof img { margin: 0 auto; width: 80%; max-width: 600px; }
	.hos, .whdc { display: inline-block; margin: 10px 20px; }
	.hos img, .whdc img { width: 200px; height: auto; }
	.content { width: 100%; text-align: center; }
	.content p { max-width: 800px; margin-left: auto; margin-right: auto; }
	p.divided { padding-top: 1em; border-top: 2px solid rgba(0,0,0,0.3); }
	
	/* tiles */
	
	.tiles 
	{ 
		display: flex; align-items: flex-start; gap: 30px; flex-wrap: wrap; justify-content: center; padding: 30px 0; margin: 30px 0; 
	}
	.tile { text-decoration: none; flex-basis: 200px; }
	.tile .img { width: 100%; height: 0; padding-top: 50%; background-position: center center; background-size: contain; background-repeat: no-repeat; }
	.tile .name { line-height: 1.2; }
	.tile .cuisine { font-weight: 300; color: #000000; font-size: 90%; }
	
	/* mobile */
	
	@media screen and (max-width: 900px)
   {
      .frame { padding-left: 30px; padding-right: 30px; }
		#topbar .hum { padding-left: 5px; }
   }
	
	@media screen and (max-width: 640px)
   {
		body { font-size: 18px; line-height: 1.35; }
		#topbar { display: none; }
		h4 { font-size: 26px; }
		.fof { margin-top: 0; }
		.tile { flex-basis: 120px; }
		.nomobile { display: none; }
	}