* {
	margin: 0;
	padding: 0;
	font-family: Sans-serif;
	box-sizing: border-box;
}
html {
		scroll-behavior: smooth;
	/*
	box-sizing: border-box;
	overflow-x: hidden;
	*/
}
#about,
#stores,
#emailList,
#contact {
	scroll-margin-top: 120px;
}
/*
#about {
	scroll-margin-top: 210px;
}
#stores {
	scroll-margin-top: 390px;
}
#emailList {
	scroll-margin-top: 150px;
}
#contact {
	scroll-margin-top: 110px;
}
*/

body {
	background-color: rgba(248, 248, 255, 0.95);
	/*scroll-behavior: smooth;*/
}
a,
a:checked,
a:visited {
	text-decoration: none;
	color: inherit;
}
li {
	list-style: none;
}

.background_puff-store_logo {
	/*background: url(/src/images/tinified/puff-store-logo-bird-transparent-cropped.png);*/
	background: url(/src/images/logo_black_transparent.png) center/contain no-repeat;
	background-size: contain;
	position: fixed;
	width: 100vw;
	max-width: 800px;
	height: 100vh;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	z-index: -1000;
}


/* ---------- makes sections appear and disappear ---------- */
.scroll_fade_in_out {
  opacity: 0;
	transform: scale(0.5);
  transition: opacity .6s ease, transform .6s ease;
}
.scroll_fade_in_out.visible {
  opacity: 1;
	transform: scale(1);
}
.scroll_fade_in_out.fade_out {
  opacity: 0;
	transform: scale(0.5);
}


/*----------- a warning underneath the page of the flavor ban ----------*/
.warning {
    position: fixed;
    bottom: 0;
    z-index: 900;
    background-color: #fff;
    padding: 7px 5px;
    width: 100vw;
    border: solid 3px #000;

    transform: translateY(100%);
    opacity: 0;
    transition: transform 0.5s ease-out, opacity 0.5s ease-out;
}
.warning.show-warning {
    transform: translateY(0);
    opacity: 1;
}
.warning p {
    max-width: 820px;
    margin: auto;
}




/*---------- back to top button ------------*/
#backToTop {
  position: fixed;
  bottom: 10px;
  right: 10px;
  width: 50px;
  height: 50px;
	border: solid 1px #fff;
  border-radius: 50%;
  /*background-color: #0061ff;*/
  background-color: #039cdf;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
	overflow: hidden;
  display: none;
  z-index: 1500;
	box-sizing: border-box;
  transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}
#backToTop:hover {
  /*background-color: #039cdf;*/
  transform: scale(1.05);
}